Getting Attempted import error: [icon] is not exported when using Next.js in a Turborepo application

[AliceYuuuuuu]

Package

• lucide
• lucide-angular
• lucide-flutter
• lucide-preact
• lucide-react
• lucide-react-native
• lucide-solid
• lucide-svelte
• lucide-vue
• lucide-vue-next
• Figma plugin
• source/main
• other/not relevant

Version

0.429.0

Can you reproduce this in the latest version?

• Yes
• No

Browser

• Chrome/Chromium
• Firefox
• Safari
• Edge
• iOS Safari
• Opera
• Other/not relevant

Operating system

• Windows
• Linux
• macOS
• ChromeOS
• iOS
• Android
• Other/not relevant

Description

Howdy y'all!

When using the latest versions of Next.js in a Turborepo application, I'm encountering the following errors for random icons:

'use client'
import { SendHorizontal, Check, Clock, LoaderCircle } from "lucide-react";

<LoaderCircle className="animate-spin-slow h-12 w-12 self-center justify-self-center text-black" />

Attempted import error: 'LoaderCircle' is not exported from '__barrel_optimize__?names=Check,Clock,LoaderCircle,SendHorizontal!=!lucide-react' (imported as 'LoaderCircle').

'use client';
import { ChevronRight, LifeBuoyIcon, Info, CircleHelp } from "lucide-react";

 Attempted import error: 'CircleHelp' is not exported from '__barrel_optimize__?names=ChevronRight,CircleHelp,Info,LifeBuoyIcon!=!lucide-react' (imported as 'CircleHelp').

Interestingly enough, the icons still render fine in the browser despite the errors.

Steps to reproduce

1. Create a turborepo using turbo 2.0.14
2. Create a Next.js app using "next": "14.2.5" and "lucide-react": "^0.429.0"
3. In a component with use client, try importing and using the CircleHelp icon
4. The error should show up in the Next.js console but the icon renders properly

Checklist

• I have searched if someone has submitted a similar issue before and there weren't any. (Please make sure to also search closed issues, as this issue might already have been resolved.)

[benjick]

Same issue, did you manage to solve this?

[Electronica-dev]

Importing icons directly from node_modules worked for me: import { ChartGantt } from "../../../node_modules/lucide-react".

Using "lucide-react": "^0.445.0" and "next": "14.2.3"

[theshadowagent]

Same issue

[Husain010]

Still getting the issue, is there any resolution?

[benjick]

Make sure you have the same version of lucide-react installed all over your monorepo, that was it for me

pnpm dlx sherif@latest

[ericfennis]

Can't reproduce on latest version of nextjs(with turbopack) and lucide-react. @benjick comment is maybe related to your issues.

[emmyoh]

Same issue :/

[LeonFedotov]

Im also having that issue on latest lucide