AI 助理
备案控制台
开发者社区 问答 正文

Webpack中如何处理Sass和Scss文件？

Webpack中如何处理Sass和Scss文件？

展开
收起
迪哒迪滴喵 2024-08-27 16:12:13 87 分享 版权

版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

2 条回答
写回答
取消 提交回答
  • 小周sir
    面对过去，不要迷离；面对未来，不必彷徨；活在今天，你只要把自己完全展示给别人看。

    通过使用 sass-loader来编译处理
    https://webpack.docschina.org/loaders/sass-loader/

    image.png

    2024-08-27 21:12:11
    赞同 6 展开评论
  • 迪姐暴打小怪兽

    通过module.rules数组中的规则来处理Sass和Scss文件。使用MiniCssExtractPlugin.loader、css-loader和sass-loader。例如：

    { 
test: /\.(sass|scss)$/, 
use: [ 
{ 
loader: MiniCssExtractPlugin.loader, 
}, 
{ 
loader: 'css-loader', 
options: { 
importLoaders: 2, 
sourceMap: !!DEV, 
}, 
}, 
{ 
loader: 'sass-loader', 
options: { 
sourceMap: !!DEV, 
}, 
}, 
], 
}

    **

    2024-08-27 17:45:02
    赞同 8 展开评论
问答标签：
Webpack文件 Webpack sass Webpack sass文件 Webpack scss
问答地址：
开发者社区 > 云计算 > 问答
相关问答
如何在Webpack中配置Babel来转译JSX和TSX文件？
154
1
0
Webpack中的Tree Shaking是如何工作的，如何避免将某些库或文件标记为“活”代码？
85
1
0
如何在Webpack中配置资源压缩以优化CSS和JS文件？
118
1
0
如何在Webpack配置中自动删除上次的打包文件？
128
1
0
如何在 Webpack 中处理 CSV 和 XML 文件？
88
1
0
如何配置 Webpack 以处理 CSS、Less 和 Sass 文件？
81
1
0
如何为 CSV 和 XML 文件配置 Webpack loader？
66
1
0
如何在 Webpack 中配置 loader 来处理 CSS、Less 和 Sass 文件？
144
1
0
如何在Webpack中配置添加对TypeScript的支持？
104
1
0
Webpack配置中如何根据环境变量动态启用或禁用插件？
66
1
0