react
でアプリをプリレンダリングしようとしていreact-snap
ます。私のプロジェクトは を使用していませんcreate-react-app
。
// react-snap configuration
{
inlineCss: true,
source: "dist",
skipThirdPartyRequests: true
}
でアプリケーションをビルドした場合、事前レンダリングは正しく機能しましwebpack
mode: development
た。しかし、本番ビルドを使用する場合はそうではありません。デバッグに時間を費やした後、その問題が発生したのは を使用した場合のみであることがわかりましたcompression-webpack-plugin
。コメントアウトしたら無事終了。
/// webpack.config.prod.babel.js
/* eslint-disable import/default */
import merge from 'webpack-merge';
import CompressionPlugin from 'compression-webpack-plugin';
import common from './webpack.config.common.babel';
module.exports = (env = {}) => {
return merge(common(env), {
mode: 'production',
devtool: 'nosources-source-map',
plugins: [
/* when I uncomment the use of plugin, the prerendering stops to work */
// new CompressionPlugin({
// algorithm: 'gzip',
// compressionOptions: {level: 9},
// test: /\.css$|\.js$|\.map|\.svg|\.woff|\.woff2|\.ttf|\.eot$/,
// threshold: 2 * 1024,
// deleteOriginalAssets: true
// })
]
});
};
反応スナップによって報告されたエラー:
pageerror at /: SyntaxError: Unexpected token '<'
main
拡張子vendor
が.min.js
. _ しかし、私のビルドでは、拡張子が のファイルのみがあり.min.js.gz
、ブラウザからの標準リクエストで正常に処理されます。
私の製品ビルドはプリレンダリングなしで正しく動作しています。ですから、何らかのreact-snap
設定の問題だと思いますが、解決策は見つかりませんでした。
react-snap
gzip されたソースを使用することは可能ですか?