【Nuxt.js】dev や build スクリプト実行時、Client Bundle が 95％（nuxt-pwa-icon）で止まってしまう場合の対処法
発生条件
以下の条件で発生しました。
- @nuxtjs/pwa モジュールをインストールしている
- @nuxtjs/pwa のバージョンが 3.0.0-0
- nuxt.config.js の modules に '@nuxtjs/pwa' を指定している
- static ディレクトリに icon.png という名称の画像ファイル（サイズ 512*512 以上）が配置されている
つまり、Nuxt PWA の Get Started
に記載のとおりセットアップを行って
yarn(npm run) dev を実行したり、create-nuxt-app
で pwa を選択した場合に発生します。
この不具合は、開発モードでしか発生しないようです。
参考：PWA cause live site to stuck on loading files/api calls
対処法
- node_modules/@nuxtjs/icon/.cache を削除する
- @nuxjs/pwa のバージョンを、3.0.0-beta.1 以上に更新する
まず、node_modules/@nuxtjs/icon/.cache フォルダを削除します。
続いて、次のコマンドを実行して @nuxtjs/pwa モジュールのバージョンを 3.0.0-beta.1 に更新します。
yarn add @nuxtjs/pwa@3.0.0-beta.1
npm install save @nuxtjs/pwa@3.0.0-beta.1
下記参考記事 2
によると、当不具合はキャッシュが関係するものらしく、@nuxtjs/pwa 3.0.0-beta.1
で改善されたとのことなので、3.0.0-beta.1
以上のバージョンであれば OK です。
