// CSS 파일도 static 폴더에 넣어서 사용할 수도 있겠지만 다른 방식도 있다.
// css 폴더와 파일을 root 로 꺼내고 js에 import 시킨다.
// 그렇지만 현재 css 를 해석할 수 없기 때문에 css 관련 로더를 받아준다.

// main.js
import '../css/main.css';

// webpack.config.js
$ npm i -D css-loader style-loader

// module.exports
module: {
    rules: [
      {
        // .css 로 끝나는 모든 파일
        test: /\.css$/,
        use: [
          // 순서 중요. 아래에서 위로 작업
          'style-loader', // html 의 style 태그에 삽입
          'css-loader', // js 에서 import 해 온 css 파일을 해석하는 용도
        ],
      },
    ],
  },

// css 폴더와 파일을 sass 로 바꿔보자

$ npm i -D sass-loader sass

// webpack.config.js
module: {
    rules: [
      {
        // .css 로 끝나는 모든 파일
        test: /\.s?css$/,
        use: [
          // 순서 중요. 아래에서 위로 작업
          'style-loader', // html 의 style 태그에 삽입
          'css-loader', // js 에서 import 해 온 css 파일을 해석하는 용도
          'sass-loader',
        ],
      },
    ],
  },

// main.js
import '../scss/main.scss';