在vue-cli中如何安裝scss,並全局引入scss


在vue-cli腳手架采用scss正確的使用姿勢

步驟一: 安裝node-sass、sass-loader、style-loader

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

步驟二: 安裝sass-resources-loader

npm install sass-resources-loader --save-dev

步驟三: 修改build中的utils.js

scss: generateLoaders('sass')

    修改成:

    scss: generateLoaders('sass').concat(
      {
        loader: 'sass-resources-loader',
        options: {
          resources: path.resolve(__dirname, '../src/assets/global.scss')
        }
      }
    )

可知,我是在assets中創建了一個global.scss文件。

最后,在組件中的style標簽添加lang="scss",就OK了。

=======================================================

各位如果引入和使用中有任何問題可以給我發私信聯系


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM