像这样的东西:
var stylusCompiler = {
name: 'stylus',
entry: {
above_fold: './src/css/above_fold.styl',
site: './src/css/site.styl'
},
output: {
path: path.resolve(__dirname, 'dist/css'),
filename: '[name].bundled.css'
},
module: {
rules: [
{
test: /\.styl$/,
use: [
{
loader: "stylus-loader", // compiles Stylus to CSS
options: {
use: [
require('nib')(),
require('rupture')()
]
}
}
]
},
]
}
};
不起作用,因为它似乎期待JS,因此为它遇到的任何CSS提供语法错误。它正在解析手写笔,因为错误显示了编译的CSS。
默认情况下,Webpack不支持JavaScript以外的条目类型。在v4版本中提到,在将来的版本中,v4.x和v5.x将支持HTML和其他文件类型。
您可以使用MiniCssExtractPlugin从JavaScript包中提取样式并相应地命名它们。看到这个关于它的Medium post,有点过时但仍然提供了这个想法。