vue3+vite应用中添加sass预处理器问题
更新时间：2024年02月08日 17:02:37 作者：普通网友
这篇文章主要介绍了vue3+vite应用中添加sass预处理器问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
一.如何安装
进入项目目录直接npm安装即可，不用繁琐的各种配置
npm install --save-dev sass
如果安装了，但是运行vite启动项目依旧出现报错
请检查package.json文件中，sass是不是在依赖配置中，把他移动到开发依赖中即可
一般为安装sass的时候npm没有加–save-dev所导致的。
二.加入全局scss文件
打开vite的配置文件，在里面加入css的配置即可
cssPreprocessOptions: {
scss: {
additionalData: '@import "./src//scss/common.scss";' // 全局公共样式
}
}
三.关于sass的“…Using / for division…”报错
这是由于sass版本导致的问题，不影响项目编译
解决方法
1.将“/”的位置改为match.dev(arg1,arg2)
@use "sass:math"; /* 头部不要忘记加入这个，不然会报错找不到math */ /* 将这个 */ @return ($px/$rem)+rem; /* 改为下边这个 */ @return match.div($px,$rem)+rem;
2.使用官方sass-migrator工具
$ npm install -g sass-migrator $ sass-migrator division **/*.scss
官方对这个问题的更多信息请查看：
Sass: Breaking Change: Slash as Division (sass-lang.com)
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了vue项目中遇到的深拷贝浅拷贝问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10
Vue中的computed和watch都可以监听数据变化，但computed主要用于计算派生属性，而watch则用于监听特定数据变化并执行回调函数。两者使用时需要注意区别2023-04-04
这篇文章主要介绍了vue获取后台json字符串方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
本文主要介绍了Element使用el-form时，点击重置按钮或者取消按钮时会实现表单重置效果，具有一定的参考价值，感兴趣的可以了解一下2021-07-07
Vue是一套用于构建用户界面的渐进式JavaScript框架,是目前最火的前端框架之一,是前端工程师的必备技能,下面这篇文章主要给大家介绍了关于Vue3.2.x中的小技巧及注意事项的相关资料,需要的朋友可以参考下2022-04-04
Vue 3 提供了多种数据传递的方式,让我们的组件之间可以尽情地交流,接下来,我们就直接一个个来看,这些方式都是怎么工作的,感兴趣的小伙伴跟着小编一起来看看吧2024-07-07![报错[vuex] unknown action type: userLogin问题及解决](//img.jbzj.com/images/xgimg/bcimg6.png)
报错[vuex] unknown action type: userLogin问
这篇文章主要介绍了报错[vuex] unknown action type: userLogin问题及解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-06-06
这篇文章主要介绍了setTimeout在vue中的正确使用方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-01-01
overlay就是在地图上以另外一种形式浮现在地图上，常见的地图覆盖物为这三种类型，如：popup 弹窗、label标注信息、text文本信息等，接下来跟随小编看下openlayers6之地图覆盖物overlay详解，一起看看吧2021-09-09
这篇文章主要介绍了antd vue table表格内容如何格式化，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-01-01
![报错[vuex] unknown action type: userLogin问题及解决](http://img.jbzj.com/images/xgimg/bcimg6.png)
最新评论