1

サーバーからアプリのレンダリングを取得しようとしているので、ここから 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 は次のとおりです。

bundle.js

私の dist フォルダで bundle.js を参照しているはずですが、何らかの理由でそうではありませんか? index.html ファイルを renderFullPage が返すものとまったく同じにすると${html}<script> window.__INITIAL_STATE__ = ${JSON.stringify(initialState)} </script>

その後、カウンターは正常に動作します。サーバー側のレンダリングを行うと、クライアントが bundle.js コードを見つけることができないように見えるため、サーバーから受け取ったものとまったく同じコードを持つコードを作成するため、html に実行されるときにエラーが発生します。それはjavascriptを期待しています。

4

1 に答える 1