2017-03-05 34 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 
    }) 
]