【Vite】项目中scss 保存后 文件编译成了wxss,已解决

前言

最近学习使用vite,在vite中使用sass 的时候每次保存都把scss文件编译成wxss文件。众所周知,wxss文件是微信小程序的样式。当时就懵了,查了很多资料终于解决了。主要还是Easy sass 插件的原因,参考其他博主的文章(全部照搬过来了),修改设置就解决了。主要是修改extension.css(最后一张图片),其他不必要流程可以省略。

参考文章:微信小程序使用 scss

一、在 vscode 中安装 easy sass 扩展

在这里插入图片描述

二、在微信开发者工具导入 vscode 安装的 easy sass 扩展

在这里插入图片描述
在这里插入图片描述

安装完成后会让重新加载扩展

再次打开后就可以看到扩展已经有 easy sass

在这里插入图片描述

三、修改 easy sass 配置

重新加载扩展后,默认情况下这个扩展是已经启动的,但是这个扩展默认是将 scss 转为 cssmin.css 而不是 wxss,所以需要做一些修改

首先打开扩展设置

在这里插入图片描述

输入Easysass: Formats筛选到准确设置,并打开配置文件

在这里插入图片描述

可以看到这里默认有两个配置,一个是扩展视图的.css,一个是压缩视图的.min.css

在这里插入图片描述
修改一下即可,使用 scss 基本就用不到修改 wxss 了,所以我这里使用压缩视图,然后把后缀改为.wxss 即可

在这里插入图片描述

下班~

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

fruge365

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值