Webpack + Babel require 在全局范围内失败但在函数内部工作

Question

我正在使用 webpack 1.12.14 并且不能要求图像到全局常量，例如

const icon = require("icon.svg");
class TestClass {

失败并显示 [错误：找不到模块 'icon.svg'] 代码：'MODULE_NOT_FOUND' }

Error: Cannot find module 'icon.svg'
at Function.Module._resolveFilename (module.js:325:15)
at Function.Module._load (module.js:276:25)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (Test.js:15:19)
at Module._compile (module.js:409:26)
at loader (PATH/node_modules/babel-register/lib/node.js:126:5)
at Object.require.extensions.(anonymous function) [as .js] (PATH/node_modules/babel-register/lib/node.js:136:7)

来自我的 webpack.config:

resolve: {
    modulesDirectories: ["web_modules", "node_modules", "images"]
},

和装载机：

 {
    test: /\.js(x?)$/,
    loader: "babel",
    exclude: /node_modules/,
    query: babelOptions
 },
 {
        test: /\.svg$/,
        loaders: [
            "file?name=[hash].[ext]"
        ]
    }

我的babelOptions.js

exports.babelOptions = {
    presets: ["es2015", "react"]
 }

我可以在函数或构造函数中要求，例如：

class TestClass {
    constructor() {
       const icon = require("icon.svg");
    }
}

Answer 1

升级到 webpack 3.4 解决了

Webpack + Babel require 在全局范围内失败但在函数内部工作

Webpack + Babel require fails in global scope but works inside functions

require

reactjs

webpack

babeljs

babel-register