Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

vite plugin fails to resolve files when full path starts with /app (remix, docker) #1402

Open
2 tasks done
meatwallace opened this issue May 1, 2024 · 0 comments
Open
2 tasks done

Comments

@meatwallace
Copy link

meatwallace commented May 1, 2024

Describe the bug

reporting a fairly obscure issue but it caught me up for a while so think it's worth noting:

  • using the vite plugin in combination with remix and docker
  • setting WORKDIR to /app causes compilation to fail with errors from resolveId, presumably because remix uses the app/ dir
  • changing the WORKDIR to anything else makes it work
  • i did NOT try this using a more traditional application (no remix) using a src/ directory with a mirroring /src WORKDIR in docker.
  • i suspect it might be something to do with the way getAbsoluteId works but i didn't dig too far

Reproduction

https://github.com/meatwallace/vite-remix-vanilla-extract-docker-repro

System Info

from my host PC. dockerfile is same node/npm/yarn but running in the official node slim image.

System:
    OS: Linux 5.15 Arch Linux
    CPU: (12) x64 AMD Ryzen 5 5600X 6-Core Processor
    Memory: 25.41 GB / 31.31 GB
    Container: Yes
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.12.2 - ~/.asdf/installs/nodejs/20.12.2/bin/node
    Yarn: 1.22.19 - ~/.asdf/installs/nodejs/20.12.2/bin/yarn
    npm: 10.5.0 - ~/.asdf/installs/nodejs/20.12.2/bin/npm
    pnpm: 9.0.6 - ~/.asdf/installs/nodejs/20.12.2/bin/pnpm
  npmPackages:
    @vanilla-extract/css: ^1.15.1 => 1.15.1 
    @vanilla-extract/vite-plugin: ^4.0.9 => 4.0.9 
    vite: ^5.1.0 => 5.2.10

Used Package Manager

yarn

Logs

Error: [remix] No CSS for file: /app/routes/_index.css.ts
file: /app/app/routes/_index.css.ts?client-route=1
    at Object.getCssForFile (/app/node_modules/@vanilla-extract/vite-plugin/node_modules/@vanilla-extract/integration/dist/vanilla-extract-integration.cjs.prod.js:853:15)
    at Context.resolveId (/app/node_modules/@vanilla-extract/vite-plugin/dist/vanilla-extract-vite-plugin.cjs.prod.js:172:79)
    at Object.resolveId (file:///app/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:51057:64)
    at async ModuleGraph._resolveUrl (file:///app/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:64543:46)
    at async file:///app/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:64445:45
    at async Promise.all (index 0)
    at async ModuleGraph.updateModuleInfo (file:///app/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:64385:13)
    at async TransformContext.transform (file:///app/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:66456:39)
    at async Object.transform (file:///app/node_modules/vite/dist/node/chunks/dep-DkOS1hkm.js:51133:30)
    at async getRouteModuleExports (/app/node_modules/@remix-run/dev/dist/vite/plugin.js:232:21) {
  plugin: 'remix',
  id: '/app/app/routes/_index.css.ts?client-route=1',
  pluginCode: "import '/app/app/routes/_index.css.ts.vanilla.css';\n" +
    "export var container = '_1pf1p030';",
  code: 'PLUGIN_ERROR',
  hook: 'transform',
  watchFiles: [
    '/app/app/entry.client.tsx',
    '/app/app/root.tsx',
    '/app/app/routes/_index.css.ts',
    '/app/app/routes/_index.tsx',
    '/app/package.json',
    '/app/node_modules/react/jsx-runtime.js',
    '/app/node_modules/@remix-run/react/dist/esm/index.js',
    '/app/node_modules/react/index.js',
    '/app/node_modules/react-dom/client.js',
    '/app/node_modules/@remix-run/react/dist/esm/browser.js',
    '/app/node_modules/@remix-run/react/dist/esm/components.js',
    '/app/node_modules/@remix-run/react/dist/esm/server.js',
    '/app/node_modules/@remix-run/react/dist/esm/scroll-restoration.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/index.js',
    '/app/node_modules/react-router-dom/dist/index.js',
    '/app/node_modules/react/cjs/react-jsx-runtime.production.min.js',
    '/app/node_modules/react/cjs/react.production.min.js',
    '/app/node_modules/react-dom/index.js',
    '/app/node_modules/@remix-run/react/dist/esm/errorBoundaries.js',
    '/app/node_modules/@remix-run/react/dist/esm/routes.js',
    '/app/node_modules/@remix-run/react/dist/esm/single-fetch.js',
    '/app/node_modules/react-router-dom/server.mjs',
    '/app/node_modules/@remix-run/react/dist/esm/_virtual/_rollupPluginBabelHelpers.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/cookies.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/formData.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/responses.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/single-fetch.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/server.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/sessions.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/sessions/cookieStorage.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/sessions/memoryStorage.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/upload/memoryUploadHandler.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/upload/errors.js',
    '/app/node_modules/@remix-run/server-runtime/dist/esm/dev.js',
    '/app/node_modules/react-dom/cjs/react-dom.production.min.js',
    '/app/node_modules/@remix-run/react/dist/esm/errors.js',
    '/app/node_modules/@remix-run/react/dist/esm/invariant.js',
    '/app/node_modules/@remix-run/router/dist/router.js'
  ]
}

Validations

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant