使用vue導入新的scss文件js 2

Question

我在將新的.scss導入到與主scss文件不同的全新頁面模板vue時遇到了問題。我發現這link但仍然我的新風格將無法正常工作。順便說一下，我使用laravel 5.4。

新VUE組件：

<style lang="scss" scoped> 
    @import "~sass/new"; //new scss file from resources/sass directory 
</style> 

我想我錯過庫安裝或什麼。任何幫助將非常感激。

Answer 1

檢查，如果你已經安裝了「青菜裝載機'節點薩斯「風格裝載機」

如果沒有則使用以下命令

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

安裝看看你的package.json是與此類似

"devDependencies": { 
    "css-loader": "^0.23.1", 
    "node-sass": "^4.1.1", 
    "sass-loader": "^3.2.3", 
    "style-loader": "^0.13.1" 
    "vue-loader": "^9.0.0", 
    "vue-router": "^2.1.1", 
    "webpack": "^1.12.2", 
    "webpack-dev-server": "^1.12.0" 
} 

這時可以嘗試

<style lang="scss" scoped> 
    @import 'main.scss' 
</style> 

這篇文章必須對你有所幫助Using SASS/SCSS in Vue.js 2