webpack中sass-loader里node-sass改成sass的终极方案
638
2024-05-31 14:41
6 个月前
在webpack5中如何把sass-loader中使用的node-sass改成sass
我们在很多时候启动了旧项目,里面的webpack用了sass-loader去编译sass文件或者scss文件,但是node-sass是跟node版本强关联的,很多时候我们需要用到node版本切换工具和去node-sass网站查看版本对应记录来修改对应的node-sass依赖,最后发现在开发团队下面,变成了node版本是个强依赖,下面我们改成用sass模块去解决这个问题
// 使用sass-loader的时候加个options,使用implementation把node-sass改成sass,
// 然后执行npm uninstall node-sass
const isDev = process.env.NODE_ENV!=='production'
{
test: /\.s[ac]ss$/,
exclude: /\.module\.s[ac]ss$/,
use: [
isDev
? 'style-loader'
: MiniCssExtractPlugin.loader,
{
loader: 'css-loader'
},
'postcss-loader',
{
loader: 'sass-loader',
options: {
implementation: require('sass')
}
}
]
}