Webpack sass css 파일은 어디에 있습니까?

Webpack sass css 파일은 어디에 있습니까?

---

다음과 같이 sass 로더와 함께 웹 팩을 사용하고 있습니다.

module.exports = {
  module: {
    loaders: [
      {
        test: /\.scss$/,
        loader: "style!css!sass"
      }
    ]
  }
};

하지만 스타일 태그에 스타일이 적용되는 것을 봅니다. 생성 CSS 파일은 어디에 있습니까?

---

기본적으로 스타일 로더는 컴파일 된 CSS를 번들로 인라인하여 출력 파일 (예 : bundle.js. 은 Using 추출물 - 텍스트 웹팩 - 플러그인 이 번들에서 컴파일 된 CSS를 제거하고 별도의 파일로 내보낼 수 있습니다.

먼저-플러그인에서 로더를 래핑합니다.

 loaders: [{
  test: /\.scss$/,
  loader: ExtractTextPlugin.extract(
    "style",
    "css!sass")
 }]
},

그런 다음 생성 된 파일을 호출 할 플러그인을 지정합니다.

plugins: [
    new ExtractTextPlugin("app.css")
 ]

일반적으로이 파일을 HTML에 포함합니다.

---

Webpack을 사용할 때 별도의 CSS 파일이 필요한 경우 extract-text-webpack-plugin 을 사용해야합니다 .

참고 URL : https://stackoverflow.com/questions/29210325/webpack-sass-where-is-the-css-file