Sass in webpack

Question

這是我第一次與Webpack，我不記得爲什麼我的sass文件（.scss）沒有加載。我花了整個下午嘗試和搜索，但我不明白我的代碼中有什麼問題。

webpack.config.js

module.exports = { 
    entry: "./main.js", 
    output: {path: __dirname, filename: "bundle.js"}, 
    module: { 
    loaders: [ 
     { 
     test: /.jsx?$/, 
     loader: "babel-loader", 
     exclude: /node_modules/, 
     query: { 
      presets: ["es2015", "react"] 
     } 
     }, 
     { 
     test: /\.css$/, 
     loader: "css-loader!autoprefixer-loader" 
     }, 
     { 
     test: /\.scss$/, 
     loader: "css-loader!sass-loader" 
     } 
    ] 
    } 
}; 

的package.json依賴關係：

//... 
"dependencies": { 
    "react": "^0.14.7", 
    "react-dom": "^0.14.7", 
    "react-redux": "^4.4.0", 
    "redux": "^3.3.1", 
    "webpack-dev-server": "^1.14.1" 
    }, 
    "devDependencies": { 
    "autoprefixer-loader": "^3.2.0", 
    "babel-core": "^6.6.5", 
    "babel-loader": "^6.2.4", 
    "babel-preset-es2015": "^6.6.0", 
    "babel-preset-react": "^6.5.0", 
    "css-loader": "^0.23.1", 
    "node-sass": "^3.4.2", 
    "redux-devtools": "^3.1.1", 
    "sass-loader": "^3.1.2", 
    "webpack": "^1.12.14" 
    } 
//... 

在我app.js我加入這一行：

import "./app/sass/app.scss"; 

終端中沒有錯誤，Chrome控制檯也沒有錯誤。 但SASS文件未加載。

我的代碼有什麼問題？

謝謝！

Answer 1

您必須安裝style-loader,css-loader和sass-loader以及。
要做到這一點，運行：
npm i css-loader style-loader sass-loader --save-dev

然後，添加裝載機到您的WebPack配置。

// ... 
    { 
     test: /\.scss$/, 
     loader: 'style!css!sass' 
    }] 
// ... 

您們好路徑，但