LoginSignup
code-shm
@code-shm

Are you sure you want to delete the question?

Leaving a resolved question undeleted may help others!

browser-syncでサーバーを立てた際にconsoleに不明なメッセージが表示される

解決したいこと

xammpでローカルサーバーを立てたうえで「webpack」と「browser-sync」を使ってサーバーを立てるプロジェクトデータを作成しています。
「browser-sync」を使ってnpm-scriptsで開発モードのサーバーを立てると、見覚えのないログが多数表示されており、消すことができないので、解決方法を教えていただきたいです。

発生している問題・エラー

開発者ツールでconsoleを確認すると、以下のような「workbox」というメッセージが多数表示されます。

スクリーンショット 2024-04-01 192009.png

試しに「webpack-dev-server」でサーバーを立ててみたところ、こういった表示は無かったので、「browser-sync」の設定の問題なのかと思っています。

開発者ツールを見ると「superpwa-sw.js」が動いている?ようなのでPWAの設定なのでしょうか。

スクリーンショット 2024-04-01 193106.png

「browser-sync」の公式ドキュメントを見てみましたが、それらしき設定はありませんでした。

以下プロジェクトデータの設定になります。

package.json
"scripts": {
  ~
  "start": "browser-sync start --startPath ./ --files='src/**/*.html, src/assets/css/**/*.css, src/assets/js/**/*.js' --config bs-config.js",
  ~
}
"devDependencies": {
  "browser-sync": "^3.0.2",
  ~
  "webpack": "^5.91.0",
  ~
}
bs-config.js
module.exports = {
  proxy: 'localhost:8440', // ローカルサーバー
  reloadOnRestart: true,
  notify: false
}

PWAについての知識が乏しいことが原因なのかと思っています。
不勉強で申し訳ありませんが、解決方法を教えていただきたいです。

0

1Answer

自己解決しました。

開発者ツール「Application」タブ

Service workers

「superpwa-sw.js」をunregister

以上でメッセージを削除できました。

1

Your answer might help someone💌