是否可以配置webpack,使其输出未编译的scss文件和已编译的scss文件?
我希望以这种方式公开scss变量、mixin和函数。
档案:
styles/
index.scss
网络包配置.js:
module.exports = {
entry: path.resolve(__dirname, "./src/index.js"),
plugins: [
new MiniCssExtractPlugin({
// Options similar to the same options in webpackOptions.output
// both options are optional
filename: "./lib/index.css",
}),
],
module: {
rules: [
{
test: /\.scss$/i,
use: [
MiniCssExtractPlugin.loader,
"css-loader",
{
loader: require.resolve("sass-loader"),
options: {
warnRuleAsWarning: true,
sourceMap: true,
sassOptions: {
includePaths: ["../../node_modules"],
outputStyle: "compressed",
outFile: path.resolve(__dirname, "./lib/index.css"),
},
},
},
],
}
]
},
resolve: {
extensions: [".tsx", ".ts", ".js", ".css", ".scss"],
},
output: {
filename: "[name].js",
library: {
type: "umd",
name: "design-system",
}
}
};
示例输出:
lib/
index.css (compiled version)
index.scss (uncompiled version)
1条答案
按热度按时间mccptt671#
我认为这是不可能的,除非你为它使用一个不同的插件,所以我建议在这个用例中使用
copy-webpack-plugin
。