webpack server side rendering

• 結局問題なのは、CSSとか画像とか動画とか、webpackのrequire() or import に依存したReact Componentが存在するということ。
• Server Side Renderingしたい場合、Nodeサーバ側もそれらのリソースを解釈できないとエラーになる。つまり、サーバ側も事前にwebpackでビルドしてからプロセス起動する必要があるということだ。
• 開発のイテレーションを早くするには、下記の手順をいかに効率良く行うかに尽きる。

具体的な開発手順

1. サーバファイル変更
2. webpackリビルド
3. Nodeサーバ再起動

github

github.com

所感

• 上記のプラグイン＋pm2でそれっぽい挙動になる。

isomorphic CSS or isomorphic images

• client側でビルドした際のstaticリソース。自前のwebpack設定でビルドした際のstaticリソース。これらが２重生成される？
• とすると、Server Side Rendering時はサーバ側でビルドしたリソースが読み込まれる。
• クライアント側で遷移した際（require.ensureなど）はクライアント側でビルドしたリソースが読み込まれる。