Next.js Discord

Discord Forum

Turbopack doesn't properly load tailwind v3 plugins

Unanswered
Nebelung posted this in #help-forum
Open in Discord
NebelungOP
When running Next Serve with Turbopack, we're encountering a CSS parsing error, as shown in the attached file.
This issue is caused by our custom Tailwind Plugin in our preset (removing it resolves the problem):
...
  plugins: [
    // biome-ignore lint/complexity/noBannedTypes: <explanation>
    ({ addComponents, theme }: { addComponents: Function; theme: Function }) => {
      const colors = theme('colors');

      const newComponents: Record<string, unknown> = {};
      for (const [name, value] of Object.entries(colors)) {
        newComponents[`.icon-chains-color-${name}`] = {
          '&.icon-arbitrum': {
            '& > path:first-child': {
              display: 'none'
            },
            '& > *': {
              fill: value
            }
          };
        };
      }

      addComponents(newComponents);
    }
  ]
...


Even weirder, the error only appears when fill or when value parameter is used.

0 Replies