javascript - cargador de módulo dinámico webpack por require
node.js webpack-2 (3)
Me encontré con este problema en un entorno de electrones.
Mi caso de uso fue poder
require
archivos creados dinámicamente en una aplicación similar a IDE.
Quería usar el
require
electrones, que es básicamente un cargador de módulo NodeJS Common.
Después de ir y venir, encontré una solución que usa la configuración del módulo noParse de
noParse
.
Primero cree un módulo que será ignorado por el analizador webpack:
// file: native-require.js
// webpack replaces calls to `require()` from within a bundle. This module
// is not parsed by webpack and exports the real `require`
// NOTE: since the module is unparsed, do not use es6 exports
module.exports = require
En mi configuración de paquete web, en el
module
, indique al paquete que no analice este módulo:
{
module: {
noParse: ///native-require.js$/,
}
}
Por último, en cualquier paquete donde desee acceder al original, se requiere:
import nativeRequire from ''./native-require`
const someModule = nativeRequire(''/some/module.js'') // dynamic imports
OK, he buscado por todos lados pero no puedo determinar de manera confiable si esto es o no posible con webpack.
https://github.com/webpack/webpack/tree/master/examples/require.context Parece indicar que uno puede pasar una cadena a una función y cargar un módulo ...
Pero mi intento simplemente no funciona: webpack.config.js
''use strict'';
let webpack = require(''webpack''),
jsonLoader = require("json-loader"),
path = require("path"),
fs = require(''fs''),
nodeModules = {};
fs.readdirSync(''node_modules'')
.filter(function(x) {
return [''.bin''].indexOf(x) === -1;
})
.forEach(function(mod) {
nodeModules[mod] = ''commonjs '' + mod;
});
let PATHS = {
app: __dirname + ''/src''
};
module.exports = {
context: PATHS.app,
entry: {
app: PATHS.app+''/server.js''
},
target: ''node'',
output: {
path: PATHS.app,
filename: ''../build/server.js''
},
externals: nodeModules,
performance: {
hints: "warning"
},
plugins: [
jsonLoader
],
resolve: {
modules: [
''./node_modules'',
path.resolve(__dirname),
path.resolve(__dirname + "/src"),
path.resolve(''./config'')
]
},
node: {
fs: "empty"
}
};
El servidor.js
let _ = require(''lodash'');
let modules = [ "modules/test" ];
require( ''modules/test'' )();
_.map( modules, function( module ){
require( module );
});
El módulo en módulos / nombrado test.js
module.exports = () => {
console.log(''hello world'');
};
Pero el resultado es siempre el mismo ... los registros de pm2 solo dicen hola mundo para el requerimiento estático ... pero para la carga dinámica del mismo módulo
Error: no se puede encontrar el módulo "."
Todo lo que quiero poder hacer es recorrer una serie de rutas a los módulos y luego cargar ...
No puede usar una variable como argumento para
require
.
Webpack necesita saber qué archivos agrupar en tiempo de compilación.
Como no hace análisis de flujo de programa, no puede saber qué pasa a la función.
En ese caso, puede ser obvio, pero esto podría ir tan lejos como usar la entrada del usuario para decidir qué módulo requerir, y no hay forma de que webpack pueda saber qué módulos incluir en el momento de la compilación, por lo que webpack no lo permite.
El ejemplo que publicaste es un poco diferente.
Puede usar
require
con una cadena concatenada.
Por ejemplo:
require(`./src/${moduleName}/test`);
¿Qué módulos debe incluir webpack en el paquete?
La variable
moduleName
podría ser cualquier cosa, por lo que no se conoce el módulo exacto en tiempo de compilación.
En cambio, incluye
todos los
módulos que posiblemente podrían coincidir con la expresión anterior.
Asumiendo la siguiente estructura de directorios:
src
├─ one
│ └─ test.js
├─ two
│ ├─ subdir
│ │ └─ test.js
│ └─ test.js
└─ three
└─ test.js
Todos estos archivos
test.js
se incluirán en el paquete, porque
moduleName
podría ser
one
o algo anidado como
two/subdir
.
Para obtener más detalles, consulte require con la expresión de los documentos oficiales.
No puede recorrer una matriz e importar todos los módulos de la matriz, con la excepción anterior al concatenar una cadena, pero eso tiene el efecto de incluir todos los módulos posibles y, por lo general, debe evitarse.
Un poco tarde ... pero ... ya que está agrupando a
target: ''node''
, hay una solución para los módulos que requieren dinámicos, y omitiendo el
"efecto de incluir todos los módulos posibles"
.
La solución se saca de:
Citado de ese comentario:
const requireFunc = typeof __webpack_require__ === "function" ? __non_webpack_require__ : require;
const foo = requireFunc(moduleName);
Paquetes a:
const requireFunc = true ? require : require;
const foo = requireFunc(moduleName);