【React】SCSS、JSXファイルを使う

React

Lecture12、13の内容

SCSS

yarnでのインストールはすでに終わっているものとする。 saneeeatsu.hatenablog.com

ちなみに以下をインストールする。

$ yarn add node-sass style-loader css-loader sass-loader import-glob-loader extract-text-webpack-plugin

webpack.configに追加。

module.exports = [
  {
      :
  },
  {
    entry: {
      style: './stylesheets/index.scss', // ここ
    },
    output: {
      :
    },
    module: {
      :
    },
    plugins: [
      :
    ],
  },
];

上記のフォルダ、ファイルを作成。

$background-color-blue: #eee;

body {
  background-color: $background-color-blue;
}

htmlのheadに以下追加

<link rel="stylesheet" href="/bundle.css">

JSX

Atomではコマンド実行→再読込

$ apm install language-javascript-jsx