2017-03-05 29 views
2

在依賴升級地獄。想知道我是否可以從任何人那裏獲得小費。依賴升級地獄。這個CSS加載器有什麼問題?

能夠錘出一切,但只有一件事。我在項目中使用帶有PostCSS的CSS模塊。我正在升級到Webpack 2並藉此機會升級所有其他軟件包。

我遇到的問題是其中一個CSS處理器。基本上任何包含從另一個文件加載類的composes屬性的CSS文件都會失敗。

這是的WebPack CSS加載器是什麼樣子:

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

當我嘗試加載使用樣式表與這些組成我看到這個錯誤在瀏覽器錯誤控制檯的一個頁面:

Dynamic page loading failed TypeError: Cannot read property 'removeChild' of null 
    at removeStyleElement (eval at ./node_modules/style-loader/addStyles.js (main.js:9858), <anonymous>:122:25) 
    at remove (eval at ./node_modules/style-loader/addStyles.js (main.js:9858), <anonymous>:168:4) 
    at Array.updateStyle (eval at ./node_modules/style-loader/addStyles.js (main.js:9858), <anonymous>:180:4) 
    at addStylesToDom (eval at ./node_modules/style-loader/addStyles.js (main.js:9858), <anonymous>:69:22) 
    at module.exports (eval at ./node_modules/style-loader/addStyles.js (main.js:9858), <anonymous>:37:2) 
    at eval (eval at ./app/components/EntryGroup/styles.css (1.chunk.js:29), <anonymous>:7:77) 
    at Object../app/components/EntryGroup/styles.css (1.chunk.js:29) 
    at __webpack_require__ (main.js:687) 
    at fn (main.js:106) 
    at eval (eval at ./app/components/EntryGroup/index.js (1.chunk.js:22), <anonymous>:3:70) 

style-loader似乎是拋出錯誤,但我認爲這是因爲css-loader是讓它通過它不應該。除此之外,我不確定在哪裏看。

對此提出建議?

回答

5

我使用的CSS模塊的WebPack 2,這是工作的罰款,直到我試圖添加new webpack.NamedModulesPlugin()。如果你使用的是,請嘗試刪除它,看看如果css模塊工作

0

我有同樣的確切問題。我具有相同的裝載器配置,現在唯一解決問題的方法是使用「ExtractTextPlugin」。我知道使用ExtractTextPlugin進行開發並不可取,因爲它會減慢編譯時間,但現在我還沒有其他解決方案。如果我使用下面的配置,一切就像一個魅力。

module: { 
    rules: [ 
     // CSS 
     { 
      test: /\.css$/, 
      include: path.join(__dirname, 'src'), 
      use: ExtractTextPlugin.extract({ 
       fallback: 'style-loader', 
       use: 'css-loader?modules&importLoaders=1&localIdentName=[path]___[name]__[local]___[hash:base64:5]!postcss-loader' 
      }) 
     } 
    ] 
}, 
plugins: [ 
    new ExtractTextPlugin({ 
     filename: 'bundle.min.css', 
     allChunks: true 
    }) 
]