L'alternativa di Webpack per la maggior parte richiede l'implementazione del problema

Question

Sto costruendo l'app nw.js con Webpack e Angular. Mi piacerebbe ottenere qualcosa di quello che ho visto e usato nella mia altra app angolare piana da questo boilerplate https://github.com/jakemmarsh/angularjs-gulp-browserify-boilerplate.

Il seguente codice serve per l'organizzazione del codice & e fa un ottimo lavoro. In ogni modulo è presente un file _index.js che contiene quanto segue:

var bulk = require('bulk-require'); 
module.exports = angular.module('app.services', []); 
bulk(__dirname, ['./**/!(*_index|*.spec).js']); 

Questa esporta il modulo angolare, e poi nella stessa directory di ogni file appena lo richiede, e continua ad usarlo (non del tutto sicuro, ma probabilmente quella che richiede non deve essere nella stessa directory):

var app = require('./_index'); 
app.controller('SomeCtrl', function...); 

Ora, per l'attuazione Webpack ho provato regolando questo esempio this:

require.context("..", true, /^grunt-[^\/]+\/tasks/[^\/]+$/); 

e questa è la mia versione di esso

require.context(__dirname, true, /./**/!(*_index|*.spec).js/); 

Sono abbastanza sicuro che la mia espressione regolare non viene applicata correttamente, quindi ho bisogno del vostro aiuto su come fare questo lavoro.

D'altra parte non sono sicuro di come funzioni il bulkplate, e cosa faccia esattamente. Credo che includa tutti i file in qualche modo, perché altrimenti nessun'altra parte dell'applicazione potrebbe conoscerli. Quindi, includendo manualmente ogni direttiva, servizio e controller, direi che fa quel lavoro per voi.

Aiuto molto obbligato :)

Answer 1

RISOLTO.

Ho finito per utilizzare la soluzione da questo page e adattarlo un po '. La regex fornito da @ user3335966 restituito il file che intendevo escludere, ma grazie comunque :)

/(\w*\/)*(\w*_index|\w*\.spec)\.js/

L'idea era quella di includere tutti i file nella cartella e sottocartelle, ma non il _index.js.

Questa espressione regolare invece fa tornare tutti i file .js:

/^(.*\.(js$))[^.]*$/igm

E siccome non so regex, ho finito per escludere la _index.js nella funzione dove ho come un risultato:

var req = require.context("./", true, /^(.*\.(js$))[^.]*$/igm); 
req.keys().forEach(function(key){ 
    if (key !== './_index.js') { 
     req(key); 
    } 
}); 

Così ora ho praticamente fare questo:

module.exports = angular.module('app.homeModule', []); 

var req = require.context("./", true, /^(.*\.(js$))[^.]*$/igm); 
req.keys().forEach(function(key){ 
    if (key !== './_index.js') { 
     req(key); 
    } 
}); 

In questo modo definisco un modulo angolare e lo rendono disponibile per tutti gli altri file all'interno di tale cartella (controller, servizi, direttive).

Apprezzerei se qualcuno avesse un'idea su come eseguire l'esclusione nella regex.

Answer 2

Non sono sicuro, e può essere scambiato, ma sembra che un uso non corretto * quantifier in regex e non scappai caratteri / e .; Si sta tentando di applicare il quantificatore ridondante a /, *, ( e |;
Se si voleva ottenere "qualsiasi carattere zero o più volte", è necessario utilizzare .*
qualcosa di simile:

/\.\/.*\/!(.*_index|.*\.spec)\.js/ 

Inoltre è possibile utilizzare \w - tutti i caratteri alfanumerici (invece .);

/\.\/\w*\/!(\w*_index|\w*.spec)\.js/ 

Anche io dnt capito, quello che volevi dire, quando l'uso !;

Questo esempio trovare stringhe come aaa/bbb/ccc/blabla_index.js & aaa/bbb/ccc/blabla.spec.js:

/(\w*\/)*(\w*_index|\w*\.spec)\.js/ 

Spero che questo vi aiuterà;

Answer 3

Per la mia app di progetto Angular su ElectronJS, ho scritto un piccolo caricatore di webpack, per richiedere tutti i file nell'albero delle directory per modello, come un grosso.

Lo uso per richiedere moduli. Esempio per il file js:

//@require "./**/index.js" 

Io lo uso per richiedere tutte le dipendenze dei moduli (js, html per la cache template, immagini). Esempio per il file js:

//@require "./**/!(index|config|run)*" 

e usarlo per i CSS. Esempio di file CSS:

@require "./**/!(app|bootstrap).css"; 

Io lo uso con successo sul mio progetto. Forse è qualcun altro a rendere la vita più facile. https://www.npmjs.com/package/required-loader