构建前端第3篇之---使用scss

主要解决俩个问题:

  1. 在单个vue文件中 <style rel="stylesheet/scss" lang="scss"> 不能解析
  2. 如何在全局引入scss
  • 问题1,不能解析的问题

如果是新建的vue工程在

<style rel="stylesheet/scss"  lang="scss">
</style>

中式的scss是无法识别的

在根目录下package.json中的devDependencies中加入"node-sass": "^4.7.2","sass-loader": "7.0.3"

"devDependencies": {
    .
    .
    .    
    "node-sass": "^4.7.2",
    "sass-loader": "7.0.3"
 },

在npm install就能识别出某个vue文件中<style标签中的scss

  • 问题2,全局引入scss

在 main.js中引入

import ‘@/styles/index.scss‘ // global css

 

构建前端第3篇之---使用scss

上一篇:端口被占用的问题解决 Web server failed to start. Port ×× was already in use


下一篇:nodejs 使用浏览器调试node