Skip to content

"vite-plugin-react can't detect preamble. Something is wrong." when using styled-components #1984

@RichardWeug

Description

@RichardWeug

Describe the bug

When I'm rendering a styled component, I get the following error:
"Uncaught Error: vite-plugin-react can't detect preamble. Something is wrong. See vitejs/vite-plugin-react#11 (comment)"

Reproduction

When creating a new project I don't run into this problem. However, I'm trying to integrate vite into my existing project. Everything seems to work fine, but when I render a styled-component it crashes.

System Info

  • vite version: "^2.0.0-beta.65"
  • Operating System: macOS Big Sur
  • Node version: v14.15.5
  • Package manager (npm/yarn/pnpm) and version: npm 6.14.11

Logs (Optional if provided reproduction)

vite:cache [304] /@vite/client +0ms
vite:time 1ms /@vite/client +25s
vite:load 7ms [fs] /assets/js/website.tsx +25s
vite:transform 22ms /assets/js/website.tsx +25s
vite:time 33ms /assets/js/website.tsx +33ms
vite:hmr [file change] var/cache/dev/profiler/index.csv +106ms
vite:hmr [no modules matched] var/cache/dev/profiler/index.csv +1ms
vite:hmr [file change] var/log/dev.log +0ms
vite:hmr [no modules matched] var/log/dev.log +0ms
vite:cache [304] /node_modules/vite/dist/client/env.js +172ms
vite:time 1ms /node_modules/vite/dist/client/env.js +139ms
vite:hmr [file change] var/cache/dev/profiler/index.csv +145ms
vite:hmr [no modules matched] var/cache/dev/profiler/index.csv +1ms
vite:cache [304] vite/dynamic-import-polyfill +15ms
vite:time 1ms /@id/vite/dynamic-import-polyfill +16ms
vite:load 2ms [fs] /assets/js/components/dashboard/Dashboard.tsx +181ms
vite:hmr [self-accepts] assets/js/components/dashboard/Dashboard.tsx +24ms
vite:transform 20ms /assets/js/components/dashboard/Dashboard.tsx +178ms
vite:time 23ms /assets/js/components/dashboard/Dashboard.tsx +23ms
vite:cache [304] /@react-refresh +29ms
vite:time 0ms /@react-refresh +5ms
vite:hmr [file change] var/cache/dev/profiler/index.csv +76ms
vite:hmr [no modules matched] var/cache/dev/profiler/index.csv +0ms
vite:hmr [file change] var/log/dev.log +0ms
vite:hmr [no modules matched] var/log/dev.log +0ms
vite:time 1ms /node_modules/.vite/chunk.IXVMP6XR.js.map +103ms
vite:time 1ms /node_modules/.vite/chunk.IXVMP6XR.js.map +60ms
vite:hmr [file change] var/log/dev.log +320ms
vite:hmr [no modules matched] var/log/dev.log +0m

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions