2017-03-05 1 views
2

依存関係アップグレード地獄です。私は誰からのヒントを得ることができるかと思います。依存性のアップグレード地獄。このCSSローダーで何が問題になっていますか?

すべてを1つだけ消してしまうことができました。私はプロジェクトでPostCSSでCSSモジュールを使用しています。私はWebpack 2にアップグレードし、他のすべてのパッケージもアップグレードする機会を得ています。

私が抱えている問題は、CSSプロセッサの1つです。基本的に、別のファイルからクラスをロードする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 
    }) 
] 
関連する問題