問題タブ [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.
javascript - workbox-webpack-plugin を Nuxt PWA と併用する方法
私は現在、workbox モジュールを含む PWA プラグインを使用して Nuxt を使用しています。ただし、私が間違っていなければ、このプラグインは webpack によって生成されたアセットを事前キャッシュに追加することを許可していません。
sw.js ファイルの事前キャッシュ部分のみを生成するために workbox-webpack-plugin を使用することは可能ですか? もしそうなら、それはどのように行われますか?
https://developers.google.com/web/tools/workbox/modules/workbox-webpack-pluginにいくつかのドキュメントがありますが、これを Nuxt PWA コンテキストに適用する方法がわかりません。
javascript - Webpack 使用時に Service Worker にスクリプトをインポートする方法
Service Worker で、importScripts を使用して別のヘルパー スクリプトをインポートしようとしていますが、引き続きUncaught DOMException: Failed to execute 'importScripts' on 'WorkerGlobalScope': The script at 'http://localhost:5000/src/js/utility.js' failed to load.
Service Worker に次のコードがあります。
そして、utility.js
私は次のコードを持っています:
関数はまだ何も実行しませんが、これらのプレースホルダーも機能しません! 最終的には npm モジュールを使用できるようにしたいidb
ので、ヘルパーでこれを行っているので、通常の Javascript ファイルからも使用できます。
また、Webpack を使用してファイルをビルドしていますが、使用していない別のプロジェクトでは正常に動作しますが、このプロジェクトではビルド後にファイルが見つからないため、Webpack が何かを台無しにします。
前もって感謝します :)
service-worker - Service Worker skipWaiting 内から Webpack+Workbox でアプリビルドにアクセス
sw.js
Service Worker ファイルを生成する Workbox Plugin を使用して、Aurelia で構築され、Webpack でコンパイルされた PWA があります。ユーザーがアプリ内のリンクをクリックしたときに新しいバージョンをアクティブ化できるように、「新しいバージョンが利用可能です」というユーザー通知を作成しようとしています。
バックグラウンドで新しいバージョンを正常にダウンロードしてインストールしており、新しいバージョンの準備ができていることも検出しています。ただし、新しいバージョンでページを強制的に更新するメソッドを呼び出そうとするとskipWaiting()
、適切なスコープまたはオブジェクトがないように見えるため、失敗します。
主な問題は、おそらく自動生成されるため、実際の sw.js を編集できないことです。例はすべて の使用を示唆していますがself.skipWaiting();
、そのオブジェクトにアクセスする方法がわかりません。
webpack.config.js
index.ejs
app.js
最後の行 ( ) を除いて、すべて正常に動作しthis.swReg.skipWaiting();
ます。他の誰かが webpack+workbox プラグインを使用し、ユーザーの操作の結果として skipWaiting が発生しましたか?
workbox - ネットワークが 1 つのルートでダウンしているときに Workbox がキャッシュから取得しないのに、他のすべてのルートでは機能する理由がわかりません。
私はworkbox-webpack-pluginを使用しており、AngularフロントエンドとPythonバックエンドの異なるキャッシュに画像、css、js、およびほとんどのAPI応答をキャッシュするため、Service Workerを正常にセットアップしました
API 応答をキャッシュから正しく取得しないルートが 1 つあります。エラーが発生し続けます
そのページの API 応答はキャッシュ ストレージに保存され、情報を表示するために必要な情報が含まれています。他のすべてのページが機能し、その理由がわかりません。また、このエラーを処理するために何をする必要があるかについても言葉がありません。
このコードを使用してみましたが、イベント リスナーが起動していないようです。
});
これが私のワークボックス戦略です
Service Worker が保存された API 応答を取得することを期待していますが、そうではなく、取得に失敗したと表示されます。
vue.js - Service Worker のインストールに失敗するワークボックス ウィンドウ
vuejs アプリで workbox-window(CDN) と workbox-webpack-plugin を使用して、フォーム v3 から v4 に移行しています。
ローカルでは http-server で正常に動作しますが、デプロイ後にこのエラーが発生し、Service Worker のインストールに失敗します。
これを修正するにはどうすればよいですか?