javascript - webpack 中的动态 require 不起作用

Question

无法使用 webpack 解析动态需求。出现错误

WARNING in ./ace/config.js
112:21-40 Critical dependency: the request of a dependency is an expression

WARNING in ./ace/config.js
142:39-46 Critical dependency: require function is used in a way in which
dependencies cannot be statically extracted        

WARNING in ./ace/config.js
124:12-131:14 Critical dependency: the request of a dependency is an
expression 

有 5 个文件使用静态 require，只有 1 个文件使用动态 require。

我的 webpack 配置文件是这样的

var webpack = require('webpack');

module.exports = {
 context: __dirname + '/app',
 entry: {
    services: ["./init.js"]
},
output: {
    path: __dirname + '/public/javascript',
    filename: "[name].bundle.js?v=[hash]"
},
module: {
    loaders: [
        { test: /\.json$/, loader: 'json-loader' },
        {
            loader: 'babel-loader',
            query: {
                presets: ['es2015', 'stage-0']
            }
        },
        { test: /\.css$/, loader: "css-loader" }
    ]
},
node: {
    console: true,
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
},
target: 'node'
};

Answer 1

我们需要使用 webpack 功能来解决这些动态需求[https://webpack.github.io/docs/context.html][1]

只需要提及 webpack 可以解决这些依赖关系的目录。您也可以探索 webpack 的 ContextReplacementPlugin 来获得相同的效果。

   this =>  require([module])
   to => require(['./directory/' + module + '.js'])

其中模块名称是动态的