Question

我试图找出为什么webpack需要这个空的扩展名。

在resolve.extensions内，总是有这样的配置：

extensions: ['', '.js', '.jsx']

为什么不能这样：

extensions: ['.js', '.jsx']

Answer 1

在较新的Webpack版本中，您不能使用空字符串。它说：

Getting error: configuration.resolve.extensions[0] should not be empty。

您必须使用extensions: ['.js', '.jsx']或extensions: ['*', '.js', '.jsx']。

问题：https://github.com/webpack/webpack/issues/3043

Answer 2

来自documentation：

设置此选项将覆盖默认值，这意味着webpack将不再尝试使用默认扩展名解析模块。如果您希望正确解析其扩展程序所需的模块（例如require('./somefile.ext')），则必须在数组中包含空字符串。同样，如果您希望将不带扩展名的模块（例如require('underscore')）解析为扩展名为“.js”的文件，则必须在您的数组中包含".js"。

换句话说，如果您没有包含空字符串并且需要一个模块./foo.js，那么webpack会寻找./foo.js.js和./foo.js.jsx。

Answer 3

现在已在webpack2中对此进行了修改。

现在你必须只提供：

resolve: {extensions: ['.js', '.es6']}

如果你在数组中提供''，则会抛出错误：

configuration.resolve.extensions [0]不应为空

Answer 4

只有require a file by its full name：

才能''扩展

如果您希望正确解析其扩展程序所需的模块（例如require('./somefile.ext')），则必须在数组中包含空字符串。

Webpack将始终使用其中一个extensions，同时尝试查找文件，如下所示：

var fileName = nameGiven + extension[i];
fs.exists(fileName, ...);

如果nameGiven包含完整的文件名，例如require('./foo.js')，它仍然会附加每个扩展名：

'./foo.js' + '.js'  // './foo.js.js'  duplicated extension
'./foo.js' + '.jsx' // './foo.js.jsx' mixed extensions

与：相比：

'./foo.js' + ''     // './foo.js'     left as-is

为什么webpack需要一个空的扩展名

4 个答案: