Yocker
  1. Yocker
  3. Come caricare tutti i file in una directory usando il webpack senza richiedere istruzioni
Intereting Posts
Come implementare un’applicazione Java singola istanza? Perché non posso fare riferimento a un gradiente lineare SVG definito in un file esterno (paint server)? Entity Framework: un database, più DbContexts. È una ctriggers idea? __FILE__ la macro mostra il percorso completo Il modo più veloce per interfacciarsi tra dati di Excel (non salvati) in tempo reale e oggetti C # I getter e gli insedianti hanno un design scadente? Consiglio contraddittorio visto Come posso conservare nuove righe in un partial di AngularJS? raw vs html_safe vs. h a unescape html Aggiornamento git dal repository di origine in Ubuntu Elimina genitore se non è referenziato da nessun altro bambino process.waitFor () non restituisce mai Perché un booleano 1 byte e non 1 bit di dimensione? Come limitare gli utenti SSH a un set predefinito di comandi dopo l’accesso? Faking di una porta seriale RS232 È ansible convalidare la dimensione e il tipo di input = file in html5

Come caricare tutti i file in una directory usando il webpack senza richiedere istruzioni

Ho una grande quantità di file javascript suddivisi in 4 sottodirectory nella mia app. In grugnito li afferro tutti e li compilo in un unico file. Questi file non hanno una funzione module.exports.

Voglio usare il webpack e dividerlo in 4 parti. Non voglio entrare manualmente e richiedere tutti i miei file.

Mi piacerebbe creare un plugin che sulla compilazione cammini gli alberi delle directory, poi afferra tutti i nomi e i percorsi dei file .js, quindi richiede tutti i file nelle sottodirectory e lo aggiunge all’output.

Voglio che tutti i file in ogni directory siano compilati in un modulo che potrei richiedere dal mio file del punto di ingresso, o includere nelle risorse che menziona http://webpack.github.io/docs/plugins.html .

Quando aggiungo un nuovo file, voglio solo farlo cadere nella directory corretta e sapere che sarà incluso.

C’è un modo per farlo con webpack o un plugin che qualcuno ha scritto per fare questo?

Questo è quello che ho fatto per ottenere questo: 

function requireAll(r) { r.keys().forEach(r); } requireAll(require.context('./modules/', true, /\.js$/));

Nel mio file di app ho finito per mettere il bisogno 

 require.context( "./common", // context folder true, // include subdirectories /.*/ // RegExp )("./" + expr + "")

per gentile concessione di questo post: https://github.com/webpack/webpack/issues/118

Ora sta aggiungendo tutti i miei file. Ho un caricatore per html e css e sembra funzionare alla grande.

Che ne dici di una mappa di tutti i file in una cartella? 

 // { // './image1.png': 'data:image/png;base64,iVBORw0KGgoAAAANS', // './image2.png': 'data:image/png;base64,iVBP7aCASUUASf892', // }

Fai questo: 

 const allFiles = (ctx => { let keys = ctx.keys(); let values = keys.map(ctx); return keys.reduce((o, k, i) => { o[k] = values[i]; return o; }, {}); })(require.context('./path/to/folder', true, /.*/));

questo funziona per me: 

 function requireAll(r) { r.keys().forEach(r); } requireAll(require.context('./js/', true, /\.js$/));

NOTA: questo può richiedere i file .js in sottodirectory di ./js / in modo ricorsivo.

Esempio di come ottenere una mappa di tutte le immagini nella cartella corrente. 

 const IMAGES_REGEX = /\.(png|gif|ico|jpg|jpeg)$/; function mapFiles(context) { const keys = context.keys(); const values = keys.map(context); return keys.reduce((accumulator, key, index) => ({ ...accumulator, [key]: values[index], }), {}); } const allImages = mapFiles(require.context('./', true, IMAGES_REGEX));