1

Next.js内で sass とともにreact-flexbox-grid を構成する場合。この課題に直面しています。

latest: を使用して作成されたプロジェクトcreate-next-appで、カスタム変更はありません.babelrc

エラー

index.js:2178 警告: プロップclassNameが一致しませんでした。サーバー: "col-xs-12 col-md-4 col-lg-2" クライアント: "col-xs-12__flexboxgrid2__AdoKE col-md-4__flexboxgrid2__3pbbS col-lg-2__flexboxgrid2__1x6vt"

Sass の設定は次のようになります。

const sassConfig = {
  cssModules: true,
  cssLoaderOptions: {
    importLoaders: 1,
    localIdentName: '[local]__[name]__[hash:base64:5]'
  }
};

もう少し:

module.exports = withPlugins(
  [[withSass, sassConfig], [withCss], [optimizedImages, optimizedImagesConfig]],
  nextConfiguration
);

上記の sass 構成内に含めたり除外したりしようとしflexboxgridましたが、まだ運がありません。

localIdentName:[local]長い調査の結果、クライアントとサーバーのレンダリングの両方に一致するように、をオーバーライドすることで問題を解決できました。残念ながら、私が使用する場合: localIdentName: '[local]__[name]__[hash:base64:5]'、クライアントが使用しているため失敗します: localIdentName:[local]。では、どのように、どこで like をオーバーライドできますclientIdentNameか? で何かをする必要があり.babelrcますか?

4

0 に答える 0