vue - sass 的安装

Posted 2023-05-11

参考技术A

安装成功后 在组件中可以直接使用:

有些博客中有提到安装 style-loader , 如果项目中已经安装了 vue-style-loader 则可以不安装; 安装过过程中需要注意的是版本不兼容造成编译报错
在vue项目中直接导入scss 文件:

vuecli4配置sass与less

参考技术A 在VUE项目中，选择UI框架的时候。我一般都是element-ui选择sass，ant design of vue我选择是less。下面我们来看下如何配置，我这里使用的是vue-cli@4.5，vue@2.6。我使用的是淘宝镜像安装

相对于less而言，配置sass要简单的多了。
1、安装 node-sass 、 sass-loader

2、再 vue.config.js 中配置

1、安装 less or node-less 、less-loader 、 style-resources-loader 、 vue-cli-plugin-style-resources-loader

2、配置 vue.config.js

3、less虽然再 vue.config.js 中被引用了，还需要再 main.js 中引用才可以使用