yasutomogのブログ

JavaScriptとAzureとPHPのメモ帳

Nuxt.jsの開発サーバでHot Module Reloading (HMR)のエラー対策

概要

  • Nuxt.jsのテンプレートを使ったプロジェクト
  • 「yarn run dev」コマンドで開発サーバ起動(デフォルトの3000ポート)
  • コンソールログに「hot-update.json timed out」というエラー出力
  • ホットリローディングができない

バージョン

  • node:10.12.0
  • nuxt.js:2.0.0
  • nuxtjs/pwa:2.6.0
  • vue-cli:2.9.6
  • yarn:1.10.1

対応方法

  • 開発サーバのポートを変更
  • package.jsonのscriptsを変更
"scripts": {
  "dev": "PORT=3333 nuxt",
},
  • 特に3000番ポートは使用していなかったので、なぜこれでうまくいくようになったかは不明。。。

参考サイト(開発サーバのポート変更)

ja.nuxtjs.org