styled-components / babel-plugin-styled-components

Improve the debugging experience and add server-side rendering support to styled-components
MIT License
1.07k stars 141 forks source link

Vite + babel-plugin-styled-components throws #396

Open eldar-mekhraliev opened 1 year ago

eldar-mekhraliev commented 1 year ago

Hello, the problem seem to be related to wrapping svg Icons with styled-components, but it is very hard to follow.

I know this is not much for investigating, but i cant seem to find the proper stack.

Uncaught TypeError: Unable to determine current node version at versionIncluded (index.js:51:9)

image
ovidiuwin commented 1 year ago

Maybe it's not the case but when I bumped into this error it was because I didn't have twin.macro installed properly in the project. In my case I had a storybook app and tried to use twin.macro inside that but I didn't have twin.macro installed. Very weird error message though.

bambery commented 8 months ago

How are you getting the plugin to work at all in vite? The most recent resolution I see in the other, longer Vite thread is to run very old versions of styled-components, which I am not willing to do. I just get Error: The following dependencies are imported but could not be resolved: styled-components/macro and I've rather given up on readable class names during debugging.

lu-zen commented 7 months ago

Is this plugin supposed to work without macros? on vite it doesn't (SC v6 + plugin) This does nothing:

 plugins: [
    react({
      babel: {
        plugins: [
          [
            'styled-components',
            {
              displayName: true,
            },
          ],
        ],
      },
    }),