的WebPack不會產生app.bundle.css

Question

我有以下的WebPack文件，但是，當我運行NPM運行開發沒有得到所產生的name.bundle.css文件：（沒有錯誤或者）

const path = require('path'); 
const webpack = require('webpack'); 
const ExtractTextPlugin = require('extract-text-webpack-plugin'); 

module.exports = { 
    context: path.resolve(__dirname, './resources/'), 
    entry: { 
     app: './index.jsx' 
    }, 
    output: { 
     filename: '[name].bundle.js', 
     path: path.resolve(__dirname, './public/assets/'), 
     publicPath: '/assets/' 
    }, 
    module: { 
     rules: [ 
      { 
       test: /\.css$/, 
       use: ExtractTextPlugin.extract({ 
        use: [{ 
         loader: 'css-loader' 
        }], 
       }), 
      }, 
      { 
       test: /\.jsx|js$/, 
       exclude: [/node-modules/], 
       use: [ 
       { 
        loader: "babel-loader", 
        options: { presets: ['react', 'es2015', 'stage-1'] } 
       } 
       ] 
      }, 
      { 
       test: /\.(sass|scss)$/, 
       use: ["style-loader", "css-loader", "sass-loader"] 
      }, 
      { 
       test: /\.(jpe?g|png|gif|svg)$/i, 
       use: ['file-loader?name=[name].[ext]'] 
      }, 
      { 
       test: /\.(eot|svg|ttf|woff|woff2)$/, 
       loader: 'file-loader?name=public/fonts/[name].[ext]' 
      } 
     ] 
    }, 
    resolve: { 
     modules: [ 
      path.resolve(__dirname, './resources/'), 
      'node_modules' 
     ] 
    }, 
    plugins: [ 
     new webpack.optimize.CommonsChunkPlugin({ 
      name: 'common' 
     }), 
     new ExtractTextPlugin({ 
      filename: '[name].bundle.css' 
     }) 
    ] 
} 

我的CSS文件夾是：

CSS 
    - app.scss 
    COMPONENTS 
     comp1.scss 
     comp2.scss 

是這樣工作的 「從」 ./css/app.scss'導入樣式;」但我希望這會產生一個app.bundle.css：

new ExtractTextPlugin({ 
     filename: '[name].bundle.css' 
    }) 

Answer 1

你對css和sass都有2條規則。

我覺得你的情況，你只需要一個：

test: /\.(sass|scss)$/, 
use: ExtractTextPlugin.extract({ 
    use: [{ 
     loader: "css-loader" 
    }, { 
     loader: "sass-loader" 
    }], 
    fallback: "style-loader" 
}) 

和像你說的，你應該導入在js文件的SCSS文件import './css/app.scss'