小程序支持Scss
2022-05-16 本文已影响0人
IT_小学生
第一步:从 VSCode 中下载插件 Live Sass Compiler
第二步:打开 小程序的 扩展,然后导入 VSCode
![](https://img.haomeiwen.com/i27096180/1b52c88e42296eee.png)
![](https://img.haomeiwen.com/i27096180/936e01309ceb48cf.png)
第三步:新建 .vscode 文件夹,其中创建 settings.json 文件
![](https://img.haomeiwen.com/i27096180/7f826ace8ee27c3f.png)
{
"liveSassCompile.settings.formats": [
{
"format": "expanded",
"extensionName": ".wxss",
"savePath": null
}
],
"liveSassCompile.settings.generateMap": false
}
第四步:开启监听。点击“Watch Sass” 监听 Sass。
![](https://img.haomeiwen.com/i27096180/b9056553dab9276c.png)
文件结构
![](https://img.haomeiwen.com/i27096180/73d36c6dd602065c.png)
扩展:
现在解析的 scss代码中,会有兼容性代码产生。
css兼容性前缀,-webkit-,-moz-,-ms,-o-等
如不需要生成兼容性的代码,用以下配置文件
{
"liveSassCompile.settings.formats": [{
"format": "expanded",
"extensionName": ".wxss",
"savePath": null
}],
"liveSassCompile.settings.autoprefix": [ // 这里为空将不会有兼容性代码产生
],
"liveSassCompile.settings.generateMap": false
}
如果对你有帮助,点个赞再走呗~