vite报错[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-xYN55E4l-1657111448095)(https://upload-images.jianshu.io/upload_images/20274104-a35eeb8fa53c8afa.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)]是因为scss的内置语法需要预编译。在vite.config.ts配置tscss: { preprocessorO
Sass
（英文全称：Syntactically Awesome Stylesheets）是一个最初由Hampton Catlin设计并由Natalie Weizenbaum开发的层叠样式表语言。在开发最初版本之后，Weizenbaum和Chris Eppstein继续通过
Sass
Script来继续扩充
Sass
的功能。
Sass
Script是一个在
Sass
文件
中
使用的小型脚本语言。
使用
sass
可以使我们的样式代码变的更简洁，更具有易读性
首先，我们创建完
vue
项目
之后
尝试在
项目
中
使用
sass
语法
运行后发现果不其然
报
错
了
在使用scss之前，我们首先需要安装相关的插件
npm insta
快速解决导入susy包
错
误！修改为：
@import 'susyone';1. 收集问题compass编译
sass
脚本时
报
错
：
Undefined
mixin
‘at-breakpoint’
异常信息：没有找到宏’at-breakpoint’cmd.exe /D /C call "D:/laher/Program Files/ruby/Ruby24-x64/bin/compass.bat" comp
4 │ @include flex-row-lc;
翻阅文档: https://
vite
js.bootcss.com/config/#css-preprocessoroptions
得知需要通过..
3，可以通过淘宝的npm镜像安装node-
sass
，解决以上问题。
npm install -g cnpm --registry=https://registry.npm.taobao.org （安装淘宝镜像）
cnpm install node-
sass
--save （使用淘宝镜像安装node-
sass
）
1.解决
vue
的缩进问题
配置
eslint , 只要要eslint 对应的值为 0，则 eslint 将不会对其进行检测 (.eslintrc.js -- rules )
A. 不检测 缩进 --> 'indent': 0
B. 不检测 函数的 space --> 'space-before-function-paren': 0
2.
vue
的
sass
调用 mi...
如果安装了，但是运行
vite
启动
项目
依旧出现
报
错
，请检查package.json文件
中
，
sass
是不是在依赖
配置
中
，把他移动到开发依赖
中
即可，一般为安装
sass
的时候npm没有加–save-dev所导致的。
二、加入全局scss文件
打开
vite
的
配置
文件，在里面加入css的
配置
即可
cssPreprocessOptions: {
scss: {
additio
