ReactJSプロジェクトにCSSを追加する

Question

ここではチュートリアルをベースにしていますが、CSSファイルをアプリケーションにインポートする方法の例はありません。私はビットと作品を見つけましたが、それを行う方法を知るには十分ではありません。私は "./styles/main.css 'からのインポートスタイルを追加しました;" App.jsxとwebpackの設定は以下の通りです。

./styles/main.css
Module parse failed: C:\Projects\reactApp\styles\main.css Unexpected token (1:5)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (1:5)

だけ今div {}を持つファイル：

var css = require("css!./main.css"); 

var config = { 
    entry: './main.js', 

    output: { 
     path:'./', 
     filename: 'index.js', 
    }, 

    devServer: { 
     inline: true, 
     port: 8080 
    }, 

    module: { 
     loaders: [ 
      { 
       test: /\.jsx?$/, 
       exclude: /node_modules/, 
       loader: 'babel', 

       query: { 
        presets: ['es2015', 'react'] 
       } 
      }, 
      { 
       test: /\.css$/, 
       loader: "style!css!" 
      } 
     ] 
    } 
} 

module.exports = config;` 

私はエラーを取得します。あなただけstyle-loaderとcss-loaderを（あなたが最初にそれをnpm installする必要があります）を追加する必要があり、あなたのWebPACKの設定で

Answer 1

：

{ test: /\.css$/, loader: 'style-loader!css-loader' }, 

次に、あなたがあなたの.jsファイル（部品）でCSSを必要とすることができます

require('./styles/main.css'); 

を