如何啓用CSS模塊時排除引導文件

我在項目中啓用css-loader的模塊選項同時使用引導程序和CSS模塊，不幸的是css-loader也對引導文件應用了作用域範圍。如何啓用CSS模塊時排除引導文件

我有一個app.scss我正在導入所有引導sass文件。我導入app.scss文件到我的app.js文件：

import "./app.scss";

{ test: /\.scss$/, 
    use: [ 
     {loader: "style-loader"}, 
     { 
      loader: "css-loader", 
      options: { 
      sourceMap: true, 
      modules: true, 
      localIdentName: "[path][name]__[local]--[hash:base64:5]" 
      } 
     }, 
     {loader: "sass-loader"} 
     ]

例如引導的.table類變成像.app__table--19A_z

你怎麼想我可以禁用CSS模塊的引導文件。

來源

2017-05-27 bigFanJS

的可能的複製[webpack2：如何導入引導CSS的反應，引導找到自己的風格（https://stackoverflow.com/questions/42436728/webpack2-how-to-import-bootstrap -css-for-react-bootstrap-to-find-its-styles） –

定義單獨的規則看起來像是一個合理的解決方案，但它仍然會污染引導文件，即使我設置排除：'/ node_modules /' – bigFanJS

是你的問題解決？ –

這可能與module rule.exclude

，條件必須不匹配來完成。約定是在這裏提供一個字符串或字符串數組，但它沒有被強制執行。

所以排除了自舉SCSS文件應該是這樣的：

{ 
    test: /\.scss$/, 
    use: ... 
    exclude: [ 
    path.resolve(__dirname, "node_modules/bootstrap"), 
    ] 
}

來源

2017-08-02 06:20:06

這不能因爲要導入的引導SCSS文件到您的應用程序的SCSS文件用單一入口點簡單地exclude完成。

也不能用全局選擇器作用域完全實現，但是這絕對可以接近完成這項工作，特別是如果你不使用postcss。

要查看關於此主題的查看正在進行的討論這個問題的GitHub：https://github.com/css-modules/css-modules/pull/65

來源

2017-09-06 18:48:24 Drew2

如何啓用CSS模塊時排除引導文件

回答

相關問題