2015-02-06 14 views
10

Il mio team e io stiamo attualmente migrando un progetto piuttosto grande da AMD + RequireJS a CommonJS + Webpack. Amiamo gli strumenti che Webpack offre e pensano che CommonJS sia la direzione in cui la community si sta dirigendo: saltare sul carrozzone che si potrebbe dire.Caricamento di modelli di baffi con Webpack

Qual è un modo efficace di utilizzare il webpack per caricare e raggruppare automaticamente i file modello .mustache? Attualmente abbiamo uno script orologio che utilizza xport per raggruppare tutti i file .mustache nella nostra cartella di progetto in un unico file js nel formato:

var files = {}; 
files['path/to/file'] = '<div>{{content}}</div>'; 
files['path/to/other/file'] = '<span>{{stuff}}</span>'; 
... 

potevamo assolutamente continuare ad usare questo ... Ciò che è particolarmente conveniente su la nostra soluzione attuale è che non dobbiamo fare riferimento in modo specifico ai nostri modelli nel progetto quando creiamo un nuovo modello. Poiché lo script sta solo guardando la cartella, il dizionario viene aggiornato e possiamo usare un'altra libreria per prendere la stringa e trasformarla in una funzione di template utilizzabile.

Qual è l'obiettivo? Sono curioso di sapere se c'è un modo per passare dai modelli nella nostra cartella -> funzioni che possiamo usare nel codice senza dover richiedere specificamente i file nel progetto. E la nostra soluzione attuale va al di fuori del webpack (a meno che non ci sia un modo per farlo) che è fastidioso perché non vogliamo 2 script di controllo. Ho esaminato loaders ma questi sembrano essere il file sorgente 1 a 1 -> il file di output rispetto a molti a 1, il che è l'aspetto positivo della nostra attuale soluzione.

Grazie!

risposta

0

Penso che potresti costruire qualcosa che soddisfi le tue esigenze in cima a require.context. Indirizzalo alla directory dei modelli e ti fornirà un'API per accedere ai modelli all'interno. È possibile combinare questo approccio con mustache-loader.