如何在 Vue-cli3.x 中使用 sass / scss 的具体步骤 ：

这篇文章是对于，如何在 Vue-cli3.x 项目中使用 sass (scss 步骤相同) 的具体步骤的一个小的总结 :

---

• Sass 概念 :

Sass : 是一种 CSS 扩展语言，目前广泛地应用到 web 项目开发中，使用 sass 可以用更少的代码去实现CSS同样的样式效果，在书写上也更为简洁，其原理是通过一定的规则转化为对应的 CSS 样式，可以说是样式中的“高级语言”。Sass 在日常的开发中，是需要通过转换工具转成 CSS 再引入到 HTML 文件中，然而，在 vue 的 webpack 项目模板中，引入解释 sass 文件的 loader，即可使用 sass。 

 

•  安装 Sass 依赖包：

安装 node-sass 和 sass-loader :

npm install --save-dev node-sass;
npm install --save-dev sass-loader; 

• Sass 在组件中的使用:

• Sass 文件的导入 :

组件中导入 : @import "../../common/scss/base";    （注意引入的层级关系）；   

全局导入 : 在 main.js 中引入 sass 文件；即：import   "./commonon/base.scss"    ;