javascript - modules - require es5

Browserify requiere todos los archivos en el directorio

Question

Soy nuevo en Browserify (y en los sistemas de compilación de Javascript en general) y he llegado a un punto en el que estoy completamente confundido.

Tengo la configuración de Gulp para hacer mis compilaciones, que siempre ha funcionado bien, y últimamente he estado usando Browserify para agrupar, principalmente para poder separar mi código en archivos separados y solicitarlos require() donde deben estar.

Mi problema es que tengo una carpeta con un montón de pequeños módulos que necesito requerir dentro de otro módulo, y estoy tratando de evitar la codificación de los nombres de todos ellos. ¿Hay una manera de hacer un requerimiento de todos los archivos?

He intentado usar Bulkify y Folderify pero no puedo hacer que funcionen. Por ejemplo, con Bulkify, el paquete instalado se llama bulkify y se encuentra en la carpeta node_modules, pero luego le dicen que requiera bulk-require , que está en una carpeta sub node_modules del paquete bulkify. Cuando lo intento, Browserify se ahoga con un error de tipo Cannot find module ''bulk-require''... .

En este punto estoy confundido porque no tengo idea de por qué las instrucciones de instalación de ambos no funcionan (ni si me ayudarán). ¿Se supone que debo usarlos en mi archivo Gulp? ¿O puedo usarlos en uno de mis módulos y se llamará durante el Browserify?

Aquí hay un fragmento de mi tarea de compilación para esto si esto ayuda:

// Report Builder
gulp.task(''script-builder'', function() {
// Unminified
// **********************************************************
browserify({entries: ''./resources/assets/js/report/builder.js''})
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.bundle()
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(source(''builder.js''))
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(buffer())
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(gulp.dest(''./public/js/debug''));
// Minified
// **********************************************************
browserify({entries: ''./resources/assets/js/report/builder.js''})
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.bundle()
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(source(''builder.js''))
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(buffer())
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(ext_replace(''.min.js''))
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(uglify())
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(gulp.dest(''./public/js/dist''));
});

No tengo idea de lo que estoy haciendo aquí. ¿Voy a tener que codificar las rutas en mis llamadas a require() o hay una mejor manera?

EDITAR

Puedo ver claramente el bulk-require en el módulo de nodo bulkify :

Pero, cuando intento exigir un gran bulk-require , se ahoga:

module.exports = function(type, driver, node) {
var propertiesContainer = ''#property-container'';
var bulk = require(''bulk-require'');
var mods = bulk(__dirname, [''properties/**/*.js'']);
}

Error: no se puede encontrar el módulo ''bulk-require'' desde ''/ path / to / my / project / resources / asset / js / report''

Editar 2

Pude hacer este trabajo utilizando el paquete require-globify ( https://github.com/capaj/require-globify ). En mi javascript, utilicé:

var properties = require(''./properties/*.js'', {mode: ''hash'', resolve: [''path-reduce'', ''strip-ext'']});

Eso devolvió un objeto con claves como el nombre de archivo sin extensión o el prefijo de ruta.

En mi gulpfile.js, hice esto:

browserify({
entries: ''./resources/assets/js/report/builder.js'',
transform: [''require-globify'']
})
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.bundle()
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(source(''builder.js''))
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(buffer())
.on(''error'', function (err) { console.log(err); this.emit(''end''); })
.pipe(gulp.dest(''./public/js/debug''));

Answer 1

Esa es una tarea bastante fácil de lograr. Usando fs puede requerir dinámicamente todas las dependencias a la vez simplemente accediendo a su carpeta node_modules.

var normalizedPath = require("path").join(__dirname, "node_modules/bulkify");
require("fs").readdirSync(normalizedPath).forEach(function(file) {
require("./node_modules/bulkify" + file);
});

Más respuestas sobre esta pregunta se pueden encontrar here

EDITAR Disculpas por la respuesta genérica, entendí mal la pregunta sobre la necesidad dinámica de archivos en Browserify.

https://github.com/capaj/require-globify parece un buen enfoque para su problema.

Tómese un momento para ver también esta respuesta. Compilación de módulos requeridos dinámicamente con Browserify

Answer 2

No lo he usado, pero creo que bulkify hará lo que quieras.

¿Se supone que debo usarlos en mi archivo Gulp? ¿O puedo usarlos en uno de mis módulos y se llamará durante el Browserify?

Si y si.

Creo que la esencia de esto es algo como esto:

gulpfile.js

var bulkify = require(''bulkify'');
browserify(...)
.transform(bulkify)
// ...

another-module.js (módulo empaquetado)

var bulk = require(''bulk-require'');
var a_bunch_of_small_modules = bulk(__dirname, [''somdir/**/*.js'']);
a_bunch_of_small_modules.somedir.whatever();