수정 사항을 저장한 후에 yarn build 명령어를 한 번 더 실행해 보세요. 그리고 build 디렉터리에 loadable-stats.json이라는 파일이 만들어졌는지 확인해 보세요.

build/loadable-stats.json

{
  "errors": [],
  "warnings": [],
  "version": "4.28.3",
  "hash": "eb88458750b24e3be23f",
  "publicPath": "/",
  "outputPath": "/Users/velopert/stuff/books/개정판/21장/ssr-recipe/build",
  "assetsByChunkName": {
    "main": [
      "static/css/main.e322b749.chunk.css",
      "static/js/main.bc29bdfa.chunk.js",
      "static/js/main.bc29bdfa.chunk.js.map"
    ],
    "pages-BluePage": [
      "static/css/pages-BluePage.dbb7ee75.chunk.css",
      "static/js/pages-BluePage.fb6595f2.chunk.js",
      "static/js/pages-BluePage.fb6595f2.chunk.js.map"
    ],
    (...)

---

 

이 파일은 각 컴포넌트의 코드가 어떤 청크(chunk) 파일에 들어가 있는지에 대한 정보를 가지고 있습니다. 서버 사이드 렌더링을 할 때 이 파일을 참고하여 어떤 컴포넌트가 렌더링되었는지에 따라 어떤 파일들을 사전에 불러와야 할지 설정할 수 있습니다.