webpack " dynamic module loader von verlangen

OK, ich habe gesucht hoch und niedrig, aber nicht zuverlässig deterrmine wenn dies oder ist nicht möglich, mit webpack.

https://github.com/webpack/webpack/tree/master/examples/require.context
Wird angezeigt, um anzugeben, dass man eine Zeichenfolge übergeben, um eine Funktion oder ein Modul laden...

Aber mein Versuch ist, es funktioniert einfach nicht:
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"
    }
};

Den server.js

let _ = require('lodash');
let modules = [ "modules/test" ];

require( 'modules/test' )();

_.map( modules, function( module ){
    require( module );
});

Modul in modules/named test.js

module.exports = () => {
    console.log('hello world');
};

Aber das Ergebnis ist immer das gleiche... die pm2 logs nur sagen, Hallo Welt, für die statische erfordern... aber für das dynamische laden von dem gleichen Modul

Error: Cannot find module."

Alles was ich will zu tun zu können, ist eine Schleife durch ein array von Pfaden zu den Modulen und laden Sie dann...

InformationsquelleAutor John | 2017-03-14

27

Können Sie nicht verwenden eine variable als argument zu require. Webpack muss wissen, welche Dateien zu bündeln, wird zur compile-Zeit. Da es keine Programm-flow-Analyse, es kann nicht wissen, was Sie an die Funktion. In diesem Fall ist es offensichtlich sein könnte, aber das könnte so weit gehen, die Verwendung von Benutzer-Eingabe zu entscheiden, was das Modul zu erfordern, und es gibt keine Möglichkeit webpack kann unmöglich wissen, welche Module gehören zur compile-Zeit, so webpack nicht erlauben.

Beispiel du gepostet hast ist ein bisschen anders. Könnten Sie require mit einem verketteten string. Zum Beispiel:
```
require(`./src/${moduleName}/test`);
```
Welche Module nicht webpack brauchen, um in dem bundle? Die variable moduleName könnte alles sein, also das exakte Modul wird zur Kompilierzeit nicht bekannt. Stattdessen enthält es alle Module, die möglicherweise match die obigen Ausdruck. Angenommen, die folgende Verzeichnis Struktur:
```
src
├─ one
│   └─ test.js
├─ two
│   ├─ subdir
│   │   └─ test.js
│   └─ test.js
└─ three
    └─ test.js
```
Alle diese test.js Dateien enthalten im bundle, weil moduleName könnte one oder etwas verschachtelt wie two/subdir.

Weitere details siehe benötigen mit Ausdruck der offiziellen docs.

Können Sie eine Schleife durch ein array und importieren jedes Modul des Arrays, mit der oben genannten Ausnahme, indem eine Zeichenfolge, aber das hat den Effekt, einschließlich aller möglichen Module und sollte in der Regel vermieden werden.

Wenn nur Dinge waren diese klar und deutlich erklärt, in der Webpack-Dokumentation.
Vielen Dank, ich Schätze Sie, die Aufklärung, und vor allem die detaillierte Beschreibung der zugrunde liegenden Ursache. Haben Sie irgendwelche Vorschläge, wie ich geladen, meine Dateien für die Anzeige in Bezug auf die Allgemeinen Praktiken? Ich bin sehr neu zu Reagieren, Programmierung, und jeder ernsthafte Programmierung im Allgemeinen, so eine grobe Vorstellung, welche Art von design patterns geeignet wäre, wäre toll, so konnte ich die Forschung weiter. Danke.
Gibt es einen Weg, um webpack zu bündeln und jedes einzelne Modul im Paket.json? (es wäre natürlich nicht alle geladen werden, auf browser-clients, es sei denn, einer von Ihnen ist erforderlich)

InformationsquelleAutor Michael Jungo
3

Ich lief in dieses problem, in ein Elektron-Umgebung. Mein Anwendungsfall war in der Lage zu require dynamisch erstellte Dateien in einer IDE wie Anwendung. Ich wollte das Elektron require, das ist im Grunde eine NodeJS-Common Modul-loader. Nach einigem hin und her landete ich auf einer Lösung mit webpack s noParse Modul-Konfiguration.

Zuerst erstellen Sie ein Modul, das wird einfach ignoriert von webpack s-parser:
```
//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 = global.require
```
In meinem webpack config, unter module ist, weisen die bundler nicht zu analysieren in diesem Modul:
```
{
  module: {
    noParse: /\/native-require.js$/,
  }
}
```
Schließlich in ein Bündel, wo Sie wollen, um Zugriff auf das original benötigen:
```
import nativeRequire from './native-require`
const someModule = nativeRequire('/some/module.js') //dynamic imports
```
Diese Lösung funktionierte gut für mich, mit ein paar tweaks: 1. Zugang hatte ich zu verwenden: import nativeRequire = require('./native-require'). Es wurde beklagt, dass das Modul nicht über eine Standard-export. 2. Der export der globalen erfordern, in native-require.js ich hatte zu verwenden: module.exports = require. Dies ist, weil global.require war undefiniert für mich (Knoten 10.13, webpack 4.29)

InformationsquelleAutor Josiah Ruddell
1

Etwas spät....aber... da du Bündelung zu target: 'node' gibt es einen workaround, um dynamische Module erfordern, und unter Umgehung der "die Wirkung auch auf alle möglichen Module".

Der Lösung angehoben wird:

Mit dynamischen erfordern auf Knoten Ziele, OHNE lösen oder bündeln Sie das target-Modul · Ausgabe #4175 · webpack/webpack

Zitiert aus Kommentar:
```
const requireFunc = typeof __webpack_require__ === "function" ? __non_webpack_require__ : require;
const foo = requireFunc(moduleName);
```
Bundles:
```
const requireFunc = true ? require : require;
const foo = requireFunc(moduleName);
```
InformationsquelleAutor Gobot

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.