Shopify / hydrogen

Hydrogen lets you build faster headless storefronts in less time, on Shopify.
https://hydrogen.shop
MIT License
1.43k stars 273 forks source link

Build fails when overriding Vite `build.rollupOptions.output.entryFileNames` with templated string #2496

Open serhalp opened 2 months ago

serhalp commented 2 months ago

What is the location of your example repository?

No response

Which package or tool is having this issue?

CLI

What version of that package or tool are you using?

@shopify/cli@3.66.1, @shopify/hydrogen@2024.7.4

What version of Remix are you using?

2.11.2

Steps to Reproduce

(I can provide a failing test or example repo if it's useful. I just wanted to open this before I lose track of it.)

  1. Create a Hydrogen site (e.g. with create-hydrogen)

  2. Override Remix's default SSR bundle chunk name, setting it to a patterned string, e.g. in vite.config.js:

    build: {
    rollupOptions: {
    output: {
      entryFileNames: "[name].js"
    }
    }
    }

    (This step can also be e.g. config.build.rollupOptions.output.entryFileNames = '[name].js' in a config() hook in a Vite plugin, as in our case.)

  3. npm run build

To provide a bit more context, I work at Netlify and we encountered this while building out support for Hydrogen Vite on our platform. As noted below, we have a workaround, but it feels brittle and this could bite others in the future.

Expected Behavior

The site builds successfully. (The assumption is that since I'm (or some other Vite plugin is) writing my SSR entrypoint to a different file, I'm (or said other Vite plugin is) responsible for knowing this. Other than this one hiccup — and https://github.com/Shopify/hydrogen/issues/2497 — this does seem to work just fine.)

Actual Behavior

The build command throws ENOENT: no such file or directory dist/server/[name].js, because it assumes here that a string entryFileNames is a resolvable path when joined with serverOutDir.

I believe this is leaking assumptions from the internal Remix Vite implementation.

I can work around this by changing "[name].js" to () => "[name].js", but this feels pretty hacky!

There are a few options for fixing this:

  1. degrade gracefully when attempting to check if you should warn about the SSR bundle file size (e.g. try-catch the file read)
  2. skip the check if it contains a pattern
  3. use the actual final chunk filename from serverBuild (the value resolved from vite.build()); it should be in there somewhere

Thanks!

scottdixon commented 2 months ago

Thanks for flagging this @serhalp 🙏