The problem There are no docs on how to set this up with an existi

<a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/us

Here's the relevant documentation on Parcel's website: <a href="https://parceljs.org/l

[FEATURE REQUEST] Docs? about precache-manifest HOT 6 CLOSED

adrian2x commented on September 24, 2024

[FEATURE REQUEST] Docs?

from precache-manifest.

Comments (6)

101arrowz commented on September 24, 2024

There is no configuration. Parcel 2 makes it possible to, with 100% certainty, know which files are service workers. The manifest injects into every service worker found. Does that help @adrian2x?

from precache-manifest.

adrian2x commented on September 24, 2024

So the Parcel 2 docs are not clear on how to setup a service worker build. I think it needs to be setup as a target with context set to service-worker but I am not sure, I can't find a guide/recipe or specific instructions for service worker.
When I started looking for guides I stumbled upon your projects and it looks like they could help me with:

Generating a manifest with links to the dynamically built (hashed) assets
Preaching said dynamic assets

What I tried:
Installing this plugin & rebuilding

This did not modify my manifest or generate any precaching config, so I am not sure I'm using it right.
It would be great to see a self contained example of this plugin integrated with Parcel, or at least more info in the README about how to add this to an existing setup and what to expect.

from precache-manifest.

101arrowz commented on September 24, 2024

It's actually quite simple to use service workers in Parcel 2. Parcel has always been good with zero config, and similarly here, you don't need any config to make service workers function.

package.json:

{
    "devDependencies": {
        "parcel": "^2.0.0-nightly.xxx",
        "parcel-config-precache-manifest": "^0.0.2"
    },
    "scripts": {
        "build": "parcel build public/index.html"
    }
}

.parcelrc:

{
    "extends": ["@parcel/config-default", "parcel-config-precache-manifest"]
}

public/index.html:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
  <script src="../src/index.js"></script>
</body>
</html>

src/index.js:

if ('serviceWorker' in navigator) {
  // This is the key line: Parcel auto-detects this is a service worker
  navigator.serviceWorker.register('sw.js');
}

src/sw.js:

// Everything should work here
console.log(self.__precacheManifest);
// do whatever you need to do in your service worker here
self.addEventListener('install', event => {

});

npm build should give you a working service worker with an injected manifest. Let me know if you need anything else. @adrian2x

from precache-manifest.

101arrowz commented on September 24, 2024

@adrian2x Did that work for you?

from precache-manifest.

kkirby commented on September 24, 2024

Here's the relevant documentation on Parcel's website: https://parceljs.org/languages/javascript/#service-workers

from precache-manifest.

101arrowz commented on September 24, 2024

Yeah with @parcel/service-worker this package is obsolete.

from precache-manifest.

[FEATURE REQUEST] Docs? about precache-manifest HOT 6 CLOSED

Comments (6)

Related Issues (1)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent