Web 包 4 中的非 JavaScript 资产是否需要入口点?

Question

我成功让 webpack 生成非 JavaScript 文件的唯一方法是包含主资产的entry。问题是，webpack 也基于此资产生成一个.js文件，这是不必要的。这是在 webpack 配置中使用非 JavaScript 资产的正确方法吗？

const path = require('path');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const outputDir = 'build';
const extractStylus = new ExtractTextPlugin('../css/screen.css');
module.exports = {
entry: {
app: './src/js/index.js',
print: './src/js/print.js',
stylus: './src/stylus/screen.styl'
},
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
},
{
test: /.styl$/,
use: extractStylus.extract({
fallback: 'style-loader',
use: ['css-loader', 'stylus-loader']
})
}
]
},
plugins: [extractStylus],
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, `${outputDir}/js`)
}
};

有问题的特定行是entry对象的一部分：

stylus: './src/stylus/screen.styl'

如果没有该行，则不会生成任何内容，但是使用该行，将生成预期的.css以及stylus.bundle.js文件。

Answer 1

我想你误解了entry属性在 webpack 配置中的作用：

入口点指示应该使用哪个模块 webpack 来开始构建其内部依赖关系图。进入入口点后，webpack 将找出该入口点依赖的其他模块和库(直接或间接)。

然后，每个依赖项都会被处理并输出到称为捆绑包的文件中，我们将在下一节中详细讨论。

[来源，强调我的]

如果不指定entry，webpack 将不知道在哪里查找文件;即使依赖关系图不是定向的(它是)，你也需要将 webpack 指向图的至少一个点。

即使你只处理资产，生成JS文件的小问题是webpack通常如何使用的结果 - 作为一些用JS编写的应用程序逻辑的资产管理器/编译器。因此，从理论上讲，如果您需要通过 NodeJS 样式requires 使用编译的资产，您将使用生成的stylus.bundle.js。