Error: [remix] dest already exists.

[danestves]

Reproduction

Using this template 👉 https://github.com/kiliman/remix-vite-template that doesn't differ very much from the official one 👉 https://github.com/remix-run/remix/tree/main/templates/vite-express

It gives the following error when running remix vite:build:

This only happens to me after upgrading to 2.7.0 of Remix

System Info

System:
    OS: macOS 14.3.1
    CPU: (8) arm64 Apple M1 Pro
    Memory: 104.86 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node
    npm: 10.2.4 - ~/.nvm/versions/node/v20.11.1/bin/npm
    bun: 1.0.28 - /opt/homebrew/bin/bun
  Browsers:
    Chrome: 121.0.6167.184
    Safari: 17.3.1

Used Package Manager

npm

Expected Behavior

Build normally like the previous version (2.6.0)

Actual Behavior

Breaking the builds

[danestves]

Same error from this issue reported too 👉 #8814 I'm using CSS URLs too

[danestves]

Can confirm that build is success if I don't use css?url imports for links function

[wKovacs64]

Closed my issue as a dupe.

For reference, this broke in @remix-run/dev@2.7.0-pre.2 and carried through to 2.7.0 stable (it was fine in @remix-run/dev@2.7.0-pre.1).

[pajasevi]

Can confirm that I am experiencing the same issue but my build fails with different fatal error when I try to remove ?url.

vite v5.1.3 building for production...
✓ 95 modules transformed.
x Build failed in 392ms
Error [RollupError]: "default" is not exported by "app/tailwind.css", imported by "app/root.tsx".
file: /WebstormProjects/project/app/root.tsx:7:7
5: import robotoFlex from "@fontsource-variable/roboto-flex/index.css?url";
6: 
7: import styles from "./tailwind.css";

[markdalgleish]

Thanks for raising this. I've found the problem, I should have a fix ready soon.

[markdalgleish]

@pajasevi Your issue is expected when removing ?url from the CSS import since Vite won't provide a default export anymore.

[robertjpayne]

@markdalgleish this issue also occurs if you add extra entry points that are css files to the vite pipeline via plugins:

e.g.:

function extraEntryPoints(): PluginOption {
  return {
    name: "extra-entry-points",
    apply: "build",
    config(config, { command }) {
      if (command !== "build") {
        return;
      }

      return {
        build: {
          rollupOptions: {
            input: ["app/entry.inter.css"],
          },
        },
      };
    },
  };
}

[markdalgleish]

@robertjpayne Ah, that's interesting. If the build passes, how would that extra CSS file be part of your Remix app?

[robertjpayne]

@markdalgleish it just gets processed as it's own entry point so it gets put into the assets folder and added to the vite manifest. It was working in 2.6.0 and earlier. Attached a really really minimal example.

my-remix-app.zip

Though I did see there is a PR (#8818) for direct support without having to use a plugin to do so.

For what its worth we have an unusual integration as we are using Vite to pre-process/bundle assets for other parts of our existing web stack and using Remix in SPA mode to power specific paths that require more interaction.

[eavonius]

This just bit me too. Excited about the vite support!

[ccentrella]

Yeah, I'm experiencing same issue. It happens with any css file that is imported using Links if using ?url which is required for Vite.

import anything from "./anyfile.css?url";

export const links: LinksFunction = () => [
    { rel: "stylesheet", href: anything }
];

[markdalgleish]

@robertjpayne Thanks for sharing that repro. I've just confirmed that the PR fixing this issue also fixes your issue: #8829

[Lenghak]

Hi! Please don't mind me cause I am new to this, but how do you find out that the error is caused by the css import with url?

[ccentrella]

@Lenghak Because if you remove the ?url the error goes away :). It takes a bit of trial and error but basically I'll have a hypothesis for what might be causing the issue. If it isn't the issue, I'll keep trying different possibilities trying to isolate the problem further.

[Lenghak]

Right, sir. So it does require some experiences in order to come up with some hypothesizes or even have a sense to suspect where the error could be. I, personally, wouldn't think that the it comes from the CSS cause the error shows entirely different message. Thank you for your explanation sir, I really appreciate it.

[markdalgleish]

This is fixed by #8829, it'll be out in the next patch release.

[github-actions]

🤖 Hello there,

We just published version 2.7.2 which involves this issue. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

[markdalgleish]

@danestves @robertjpayne Can you please confirm that v2.7.2 fixes your issue?

[wKovacs64]

@markdalgleish It fixed it, thank you. ❤️

[pajasevi]

I can confirm this is fixed for me as well. Thank you guys.

[danestves]

Fixed thanks!