Webpack 2 CSS 모듈 지원

Question

지금 당장은 현재 프로젝트를 Webpack 1에서 Webpack 2으로 옮깁니다. 이전에 정상적으로 작동 한 CSS 모듈에 몇 가지 문제가 있습니다. 특히 css-loader 및 react-css-modules을 사용합니다. 현재 개발 구성은 다음과 같습니다.

test: /module\.css$/, 
use: [ 
     'style-loader', 
     { 
      loader: 'css-loader', 
      options: { 
       modules: true, 
       importLoaders: 1, 
       localIdentName: '[name]__[local]___[hash:base64:5]' 
      } 
     }, 
     'postcss-loader' 
    ] 

잘 작동합니다. 생산을 위해 나는 ExtractTextPlugin (버전 2.0.0-beta.4)을 사용하는 경우 내 웹팩 설정은 다음과 같이 진행됩니다

이 경우 빌드에서

test: /module\.css$/, 
loader: ExtractTextPlugin.extract({ 
      fallbackLoader: 'style-loader', 
      loader: [ 
        { 
         loader: 'css-loader', 
         options: { 
          modules: true, 
          importLoaders: 1, 
          localIdentName: '[hash:base64:5]' 
         } 
        }, 
        'postcss-loader' 
        ] 
       }), 

다음과 같은 오류와 함께 실패합니다

Module build failed: Error: composition is only allowed 
when selector is single :local class name 

그래서 로컬 접두사를 앞에 붙이지 않는 것처럼 보입니다. 또한 css-loader 문서에서 언급 한 :

Note: For prerendering with extract-text-webpack-plugin you should use css-loader/locals instead of style-loader!css-loader in the prerendering bundle. It doesn't embed CSS but only exports the identifier mappings.

그래서 내가 로더를 시도 : 'CSS-로더/지역 주민'뿐만 아니라 옵션에 추가,하지만, 불행히도, 아무것도 작동하지 않습니다.

또한이 문제를 postcss postcss-modules 플러그인으로 해결하려고했습니다. 빌드를 수정하지만 응용 프로그램을 시작하려고 할 때 CSS 이름 매핑을 적절하게 가져 오지 못하는 것처럼 보입니다.

Answer 1

그 사람은 미래에 같은 문제에 직면하게 될 것입니다. 이 버전의 ExtractTextPlugin (2.0.0-beta.4)에서는 Webpack-1 방식으로 로더 매개 변수를 설정해야합니다. 구체적으로 :

loader: ExtractTextPlugin.extract({ 
     fallbackLoader: 'style-loader', 
     loader: [ 
      'css-loader?modules&importLoaders=1&localIdentName=[hash:base64:5]', 
      'postcss-loader' 
     ] 
    }), 

작품 잘 날에 대한