サーバーからアプリのレンダリングを取得しようとしているので、ここから ServerRendering の例を実装しようとしていました: http://redux.js.org/docs/recipes/ServerRendering.html
server.js を正常に実行できますが、localhost をロードすると、「Uncaught SyntaxError: Unexpected token <」というエラー @ bundle.js:2 が表示されます。renderFullPage() 関数に関係していると思います:
function renderFullPage(html, initialState) {
return `
<!doctype html>
<html>
<head>
<title>Redux Universal Example</title>
</head>
<body>
<div id="root">${html}</div>
<script>
window.__INITIAL_STATE__ = ${JSON.stringify(initialState)}
</script>
<script src="/dist/bundle.js"></script>
</body>
</html>
`
}
行を削除する<script src="/dist/bundle.js"></script>
とエラーはなくなりますが、カウンターは機能しません。
エラーが参照する bundle.js は次のとおりです。
私の dist フォルダで bundle.js を参照しているはずですが、何らかの理由でそうではありませんか? index.html ファイルを renderFullPage が返すものとまったく同じにすると${html}
、
<script>
window.__INITIAL_STATE__ = ${JSON.stringify(initialState)}
</script>
その後、カウンターは正常に動作します。サーバー側のレンダリングを行うと、クライアントが bundle.js コードを見つけることができないように見えるため、サーバーから受け取ったものとまったく同じコードを持つコードを作成するため、html に実行されるときにエラーが発生します。それはjavascriptを期待しています。