雑なメモ書き

気楽にいきます

nuxtjsのbuildをいじってみた

設定ファイル

analyze

Nuxt.js では webpack-bundle-analyzer を使ってバンドルファイルと最適化の仕方を視覚化できます。

analyze: true

これを入れて、

nuxt build --analyze

実行して、アクセスすると出るようだ。

> nuxt build --analyze

ℹ Production build                                                                                                                                 22:03:13
✔ Builder initialized                                                                                                                              22:03:13
✔ Nuxt files generated                                                                                                                             22:03:13


✔ Client
  Compiled successfully in 14.28s

✔ Server
  Compiled successfully in 1.99s


Hash: 41fdaad9e02f1be6ac33
Version: webpack 4.28.3
Time: 14281ms
Built at: 2019/01/06 22:03:31
         Asset       Size  Chunks             Chunk Names
      LICENSES  426 bytes          [emitted]
        app.js   31.5 KiB       0  [emitted]  app
commons.app.js    140 KiB       1  [emitted]  commons.app
pages/index.js   3.59 KiB       2  [emitted]  pages/index
    runtime.js   2.14 KiB       3  [emitted]  runtime
 + 3 hidden assets
Entrypoint app = runtime.js commons.app.js app.js

Hash: ac3d6bd6601cb14fae1f
Version: webpack 4.28.3
Time: 1996ms
Built at: 2019/01/06 22:03:33
             Asset     Size  Chunks             Chunk Names
server-bundle.json  194 KiB          [emitted]
Entrypoint app = server-bundle.js

f:id:hiroyukim:20190106224010p:plain

  • 実行後に、自動でanaylizeされた画面が表示される。
  • これ、格好いいな。

parallel

webpack のビルドでthread-loader を有効にします。

parallel: true,

# before
Hash: b934078456bb6903bb85
Version: webpack 4.28.3
Time: 899ms
Built at: 2019/01/06 22:24:57
             Asset     Size  Chunks             Chunk Names
server-bundle.json  197 KiB          [emitted]
Entrypoint app = server-bundle.js

# after
Hash: 8d65b0b7468f404d172e
Version: webpack 4.28.3
Time: 1456ms
Built at: 2019/01/06 22:36:17
             Asset     Size  Chunks             Chunk Names
server-bundle.json  197 KiB          [emitted]
Entrypoint app = server-bundle.js