問題タブ [workbox-webpack-plugin]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
reactjs - React アプリのデフォルト Service Worker を作成して、react src コンテキスト (パブリック フォルダー) にないアセットをキャッシュするように構成するにはどうすればよいですか?
今日、Create React App の ServiceWorker を試してみましたが、public/img/favicon.ico で定義されているページのファビコンを除いてすべてがキャッシュされているため、ページがオフラインの場合、ファビコンが消え、接続エラーがコンソールに表示されます。これもキャッシュするようにService workerのWebページプラグインを設定する方法を経験した人はいますか?
webpack - workbox-webpack-plugin がすべてのアセット パスの先頭に「auto」を追加するのはなぜですか? (アプリの起動時に 404 になります)
ワークボックスは私をバナナに駆り立てています。私のアプリが起動すると、ワークボックスの InjectManifest プラグインがキャッシュされたすべての URL の先頭に「auto」を追加しているように見えるため、事前にキャッシュされたすべてのルートが http404 を返します。なぜこれを行うのかを考えなければなりません。npm パッケージの再インストール、シークレット モードでの実行、すべてのキャッシュのクリアなどを試しました。
「webpack-dev-server --mode development --open」を使用してアプリケーションを実行すると、問題の一部である可能性がある次の警告が表示されます。
webpack 構成で watch:false を設定しているため、このエラーが発生する理由がわかりません。
すべてのパスの前に「auto」があり、http404 を返すことに注意してください。Chrome の [アプリケーション] タブですべてのキャッシュをクリアしたことに注意してください。シークレットタブでも同じことが起こります。
新しいタブを開いて「自動」を削除すると、正常に機能します。
マニフェストが挿入された Service Worker ファイルは、「auto」が URL の一部であることを示しています。
誰もこれを見たことがありますか？Service Worker をゼロから作成し、workbox を捨てることを検討し始めていますが、適切に動作させることができれば明らかに workbox を使用したいと考えています。
コード：
次のように、workbox-webpack-plugin を使用して Service Worker にプリキャッシュ マニフェストを挿入します。
私の webpack.config.js は次のようになります。
私の index.html も非常に単純です。
そして、ここに私のpackage.jsonがあります: