Code Monkey home page Code Monkey logo

Comments (10)

strobilomyces avatar strobilomyces commented on July 30, 2024 3

Dealing with this after the 0.7.0 release. firien's fix works, but given that chunks/[name]-[hash] is the standard example in the esbuild docs, I expect a fair number of people are going to end up here, wondering what happened. If there's no good way to fix this in propshaft, I'd say it would be worth documenting the above fix (and maybe printing a warning when the gem is updated).

from propshaft.

brenogazzola avatar brenogazzola commented on July 30, 2024 1

Thanks for the report. I have a large app running esbuild and propshaft, so I’ll apply chunking to it and see what I can do to fix this.

from propshaft.

firien avatar firien commented on July 30, 2024 1

@brenogazzola - the "issue" is that esbuild creates many files named chunk-[hash] and propshaft will resolve that to 1 logical path: chunk.js

@weilandia - You can work around this by ensuring unique chunk names by including the hash in the "logical" part of the file name too:

chunkNames: 'chunks/[name][hash]-[hash].digested'

from propshaft.

weilandia avatar weilandia commented on July 30, 2024

After 3903815:

Screen Shot 2022-09-14 at 3 18 20 PM

from propshaft.

brenogazzola avatar brenogazzola commented on July 30, 2024

@weilandia I can't seem to replicate the problem. I've created a demo app and configured it for esbuild, chunknames, and a lazy import (file named async.js). It worked fine

Do you have a demo app showing the problem? If not, could you take a look at mine and indicated what I'm missing when trying to replicate?

Screen Shot 2022-09-24 at 14 06 34

from propshaft.

weilandia avatar weilandia commented on July 30, 2024

I can't recreate the issue with your app. If you add something like the below, you'll see the dynamic chunk file being added, but still no issue.

// a.js
import { d } from "./c.js"
console.log('a', d)
import("./b.js")
// b.js
import { c } from "./c.js"
console.log('b', c)
// c.js
export const c = 1
export const d = 2

Our app results in 76 of these chunk-... files and about 75% of them result in 404s AFTER #3903815 but works fine before. I'll plan to dig into it more next week.

from propshaft.

weilandia avatar weilandia commented on July 30, 2024

Closing this because we decided not to do chunking with esbuild, though I do think there is a hard to reproduce issue when using propshaft with esbuild chunking on large apps (after 3903815).

from propshaft.

firien avatar firien commented on July 30, 2024

also running into this issue. @weilandia were you using anything like chunkNames: 'chunks/[name]-[hash].digested' in esbuild options? If so, all the chunks resolve to the same chunks/chunk.js path and asset.fresh? fails in

if (asset = @assembly.load_path.find(path)) && asset.fresh?(digest)

image

from propshaft.

brenogazzola avatar brenogazzola commented on July 30, 2024

I'm reviewing the esbuild docs and it seems there's no option to name the chunk anything other than chunk. It seems the only solution might be reverting #100 at this point.

@rainerborene Any thoughts on this? Is there another way we can get propshaft to ensure the preloads still work without breaking esbuild chunks, which always have the same name?

from propshaft.

firien avatar firien commented on July 30, 2024

@brenogazzola, while not ideal - you can get esbuild to output unique chunks if you include the hash twice #111 (comment)

chunkNames: 'chunks/[name][hash]-[hash].digested'


I am testing propshaft (main branch & digested assets) & esbuild on a rails 7 upgrade and I have chunks loading, source maps loading (#117) - I have not yet got around to testing when esbuild updates a file and gets a new hash - whereby you have more than one "digested" file and propshaft should find the latest version

from propshaft.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.