webpackの1つのファイルに対してCSSモジュールを無効にする方法

Question

1つのファイルに対してのみCSSモジュールを無効にする必要があります。

私webpack.config.dev.jsとwebpack.config.prod.jsファイルを形作るために助けてください私は2つのWebPACKファイル

を持って、私はそれを行うことができますどのよう

を説明してください。

チュートリアルhttps://medium.com/nulogy/how-to-use-css-modules-with-create-react-app-9e44bec2b5c2でCSSモジュールをインストールしました。

私のWebPACKの設定が怒鳴るです：

DEV

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

PROD

test: /\.css$/, 
 
     loader: ExtractTextPlugin.extract(
 
      Object.assign(
 
      { 
 
       fallback: require.resolve('style-loader'), 
 
       use: [ 
 
       { 
 
        loader: require.resolve('css-loader'), 
 
        options: { 
 
        importLoaders: 1, 
 
        modules: true, 
 
        minimize: true, 
 
        sourceMap: true, 
 
        }, 
 
       },

私のファイルのパスは 'react-infinite-calendar/styles.css'です。

例外を追加するにはどうすればよいですか？

ありがとうございます！

Answer 1

使用excludeオプション：

// ... 
test: /\.css$/, 
exclude: /yor_file\.css$/, 
// ...