旧版本的微信小程序是需要导入sass,新版本直接使用配置
!!!!!!!建议二选一去使用,防止冲突目前我使用的是旧版本的配置Sass!!!!!!!!!!
新版本微信开发者工具直接在project.config.json中配置SASS
1.project.config.json文件中添加如下代码
新版本开发者工具中的隐式设置可直接编译插件配置,在project.config.json加入以下代码即可编译SASS(参考项目配置文件 | 微信开放文档)
目前支持编译插件有 typescript、less、sass
{
"setting": {
"useCompilerPlugins": [
"sass"
]
}
}
2.删除原有的.wxss文件或者把.wxss改成.scss
3.在.scss中编写样式,可以看到支持sass
如果在配置project.config.json以前使用了旧版配置,一定要先把easysass禁用掉
旧版微信小程序开发中使用scss步骤如下:
1、安装了easySass
首先确定Vscode中已经安装easySass,我们将Vscode中的导入微信小程序开发工具中
2、进入小程序开发工具,导入easySass
3、修改配置文件
导入完成以后点击 编辑--》打开编辑器扩展目录
4、修改easySass的package.json文件
修改easysass.formats中default的内容,修改后如下
5、重启项目就可以使用
在使用的时候就不要再在.wxss中去编写样式,直接在需要的地方新建一个.scss结尾的文件,在这个文件里编写样式,编写完成后对应的.wxss中会生成相应的样式,
一般使用.scss后就不要去修改删除对应的.wxss,否则样式会不生效