parcel: 🐛 Problem with loading manifest.json

Parcel will have to process the file as it may contain links to assets (images mostly).
Did you try <link rel='manifest' href='/src/manifest.webmanifest'>. This is supposed to work.

@aminnairi Yep, that’s what I did too. Mine is now named manifest.webmanifest and it works.

Thanks for reporting this 😀

It looks like you have a mistake in your code. Instead of using the path to the manifest.json in dist, you should be setting the path to your original manifest.json, and Parcel will handle transforming it to the correct path within dist.

You should be doing something like:

<!-- Assuming your manifest.json file is in a directory called src -->
<link rel=“manifest” href="/src/manifest.json">

I was using the manifest.json naming convention from the Google Web App Manifest documentation. While MDN was using the manifest.webmanifest naming convention. Using the later solved the issue (which was Parcel.js converting the manifest.json to a javascript file). Hope this helps!

Still encountering this bug in June 25, 2021

@devongovett @DeMoorJasper hey! Just wanted to drop a quick note here for parcel v2. In talking to some friends at Google, it’s important for how browsers handle web manifests specifically that the final filename stays the same between builds.

Otherwise it’s interpreted as a different app, somehow. Maybe @slightlyoff or @addyosmani can elaborate a bit.

In order to work around this I’ve had to do some HTML manipulation after the fact to inject the manifest.

I just wanted to drop note in hopes that there would be some way to control the final filename in v2.

Thanks for all your work on Parcel! ❤️

This is expected bahaviour looking at the code but in reality shouldn’t happen, marked this as bug

With all the years of experience I’ve had thinking about these graph problems while implementing Assetgraph, I can tell you that you won’t be able to infer from the asset alone what format you need to keep it in. Knowing the parent type will only be enough in the most naive cases as well. What you need is a model that also keep the information of what type of relation is between these two assets.

In Assegraph each way any asset can refer to a different asset is modelled as different relation type. This information has turned out to be much more valuable than the assets themselves, as you can infer a lot of things from the relation types alone. It’s especially valuable when you start to traverse the graph for processing.

In this single case you might be able to hack it with a condition that excludes json files linked from html from being interpreted as js. But a bit further in the future you might want to cover the case where fetch('data.json') is picked up as a file reference, and the application logic of runtime json loading would fail if the file changes extension as well.

You probably also want to start treating the webmanifest as a separate asset type inheriting from JSON, since it has well defined properties that also describe asset relations.

Ah interesting issue. The type needs to be js so JSON files can be imported from JavaScript. Ideally the assets could return multiple renditions of different types and the correct one could be chosen based on the parent asset type. Let me think about this a bit and see what I can come up with. If you have suggestions on how this could work let me know!

Can confirm this behavior. Any JSON file referenced in html entry is transformed to js module