React コンポーネントの 1 つを静的 HTML にレンダリングしたいので、それはサーバーから返された index.html にあります。
サーバーの起動中にコードがこれを行うのではなく、HtmlWebpackPlugin が React コンポーネントを生成された index.html にレンダリングすることをお勧めします。これは可能であり、非常にうまく機能します。ただし、 SCSS をインポートする React コンポーネントでこれを試みるとすぐに、次のエラーが表示されます。
エラー: /Users/calumjames/htmlwebpackplugin-error-react-rendering/tools/webpack/indexRenderer:5396
return window && document && document.all && !window.atob;
^
ReferenceError: ウィンドウが定義されていません
問題の例を示す簡単な Git リポジトリを作成しました。README ファイルに記載されているように、Loading
コンポーネントで SCSS をインポートする行がコメント化されている場合、このエラーは表示されなくなり、コンポーネントは index.html に正しくレンダリングされます。
コンポーネントは内部共有コンポーネントであり、コーディング スタイルは他の共有コンポーネントと一致するため、コンポーネントのコーディング方法を変更しないこともできます。
コードまたは構成に何か問題がありますか? それとも、Webpack プラグインまたはローダーのいずれかに問題がありますか?