[英]Webpack loader aliases?
I have a fairly complicated loader setup for style sheets: 我有一个相当复杂的样式表加载程序设置:
{
test: /\.scss$/,
loader: ExtractTextPlugin.extract("style",
"css?sourceMap&localIdentName=[path][name]__[local]__[hash:base64:5]!sass?outputStyle=expanded&" +
"includePaths[]=" + other stuff)
)
}
Which works great, but on some requires I want to add the modules
option to css-loader, so it'd look like this: 哪个效果很好,但有些要求我想将modules
选项添加到css-loader中,所以它看起来像这样:
require('./foo.scss!css?modules&sourceMap&localIdentName=[path][name]__[local]__[hash...');
But I can't do this all over the place. 但我无法在这个地方做到这一点。
How can I configure this so that I can enable the css-loader modules flag on certain requires while keeping the rest of it the same? 我如何配置它,以便我可以在某些需要启用css-loader模块标志,同时保持其余部分相同?
Maybe something like a loader 'alias', eg require('./foo.scss!my-scss-with-modules-flag-alias')
? 也许像装载机'别名',例如require('./foo.scss!my-scss-with-modules-flag-alias')
?
The only solution I can think of is writing a loader that does a syntax transform to inline the loader config into certain require calls... but that's brittle and complicated. 我能想到的唯一解决方案是编写一个加载器,它进行语法转换,将加载器配置内联到某些需要的调用......但这很脆弱且复杂。
resolveLoader.alias will work here. resolveLoader.alias将在这里工作。 Ie. IE浏览器。
resolveLoader: {
alias: {
'with-modules': 'loader definition goes here',
}
}
Using this configuration you can do simply 使用此配置,您可以轻松完成
require('with-modules!./foo.scss');
at your code. 在你的代码。
The resolveLoader.alias might work in the given case, since you are using a plugin as the loader. resolveLoader.alias可能在给定的情况下工作,因为您使用插件作为加载器。 However if you need to use a chain of loaders, it will not work. 但是,如果您需要使用一系列加载器,它将无法工作。 (There's a feature request on it: https://github.com/webpack/webpack/issues/2772 ). (有一个功能请求: https : //github.com/webpack/webpack/issues/2772 )。
Instead you can add a parameter to the file in the require statement 相反,您可以在require语句中向该文件添加参数
var styles = require('./foo.scss?modules');
And create a new loader rule: 并创建一个新的加载器规则:
module: {
loaders: [
...
{ test: /\.scss$/, loader: 'style!css!postcss!sass' },
{ test: /\.scss\?modules$/, loader: 'style!css?modules!postcss!sass' }
]
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.