Condividere un foglio di stylus tra i pacchetti

Question

Ho un'applicazione suddivisa in una manciata di pacchetti. Ognuno di questi pacchetti ha il proprio foglio .stile per lo stile dei componenti offerti dal pacchetto specifico. Attualmente, questi fogli .styl si basano tutti sulle stesse funzioni, mixin e variabili dichiarate nello variables.import.styl che si trova nella cartella ./client/styles. Lo faccio perché se cambio il colore errorRed nello variables.import.styl, cambia il colore in tutti i pacchetti.

Per ottenere l'accesso a queste variabili, nella parte superiore del foglio di stile di ogni pacchetto, ho un @import "./client/styles/variables.import". In alternativa, potrei creare un pacchetto separato per lo stilo vars &, quindi rendere quel pacchetto una dipendenza in tutti gli altri pacchetti. Non amo le due opzioni, ma suppongo che sia il prezzo che pago per mantenere i fogli di stile separati dal pacchetto. Qualcuno ha un'alternativa più elegante?

Vale la pena notare che sul ramo devel Meteor, la mia soluzione precedente non funziona più (stilo non può vedere cartella sopra la radice del pacchetto). Indipendentemente dal fatto che sia stato risolto o meno prima della prossima versione, so che deve esserci una soluzione più pulita.

Answer 1

Al Meteor 1.2, questo è ora una caratteristica lavorare fuori dalla scatola, sia stilo e meno fogli di stile.

https://github.com/meteor/meteor/tree/devel/packages/stylus#cross-packages-imports

Nella sezione package.jsPackage.onUse, utilizzare api.addFiles di dichiarare fogli stilo forniti da questo pacchetto:

api.addFiles('styles/package-sheet.styl', 'client', {isImport: true}); 

Avviso l'opzione isImport: true?

Poi, nel tuo principale foglio di stile app maestro stilo è possibile importare un pacchetto specifico (supponiamo prende il nome my-username:mypackage) Scheda utilizzando questa sintassi:

@import '{my-username:my-package}/styles/package-sheet.styl' 

Si noti che per l'importazione fogli all'interno della vostra applicazione sarà necessario anche per utilizzare questa nuova sintassi, senza alcun nome del pacchetto:

@import '{}/client/styles/app-sheet.styl' 

La sintassi precedente non sarà il lavoro longuer!

// the Meteor build tool will complain about not finding the sheet 
@import 'client/styles/app-sheet.styl'