Cannot redefine property: default

[jessaleks]

Describe the bug

I have a next.js project, and I wanted to use Preview.js. Sadly, it doesn't really work for me at all. I am getting the same error every time.

Reproduction

Example component

import { Home, Search, Bell, User } from "lucide-react";
import Link from "next/link";
import type { ReactNode } from "react";

interface NavItemProps {
	href: string;
	icon: ReactNode;
	label: string;
	isActive: boolean;
}

function NavItem({ href, icon, label, isActive }: NavItemProps) {
	return (
		<Link
			href={href}
			className={`flex items-center justify-center md:justify-start w-full md:w-auto p-2 md:p-4 rounded-lg transition-colors ${
				isActive
					? "text-primary bg-primary/10"
					: "text-muted-foreground hover:text-primary hover:bg-primary/5"
			}`}
		>
			{icon}
			<span className="text-xs md:text-sm md:ml-3">{label}</span>
		</Link>
	);
}

export default function BottomNavigation({ activePath = "/" }) {
	return (
		<nav className="fixed md:sticky bottom-0 left-0 right-0 md:top-0 bg-background border-t md:border-t-0 md:border-r border-border">
			<div className="flex md:flex-col justify-around md:justify-start items-stretch md:h-screen max-w-md md:max-w-[200px] mx-auto md:mx-0">
				<NavItem
					href="/"
					icon={<Home className="h-6 w-6" />}
					label="Home"
					isActive={activePath === "/"}
				/>
				<NavItem
					href="/search"
					icon={<Search className="h-6 w-6" />}
					label="Search"
					isActive={activePath === "/search"}
				/>
				<NavItem
					href="/notifications"
					icon={<Bell className="h-6 w-6" />}
					label="Notifications"
					isActive={activePath === "/notifications"}
				/>
				<NavItem
					href="/profile"
					icon={<User className="h-6 w-6" />}
					label="Profile"
					isActive={activePath === "/profile"}
				/>
			</div>
		</nav>
	);
}

1. Click "Open XYZ in Preview.js"
2. Boom
   

Preview.js version

1.28.3

Framework

Next.js 14.2.13, React 18.3.1

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (16) x64 AMD Ryzen 7 5700G with Radeon Graphics         
    Memory: 14.89 GB / 31.80 GB
  Binaries:
    Node: 20.17.0 - ~\scoop\apps\volta\current\appdata\tools\image\node\20.17.0\node.EXE
    Yarn: 1.22.19 - ~\scoop\apps\volta\current\appdata\bin\yarn.EXE
    npm: 10.8.3 - ~\scoop\apps\volta\current\appdata\tools\image\npm\10.8.3\bin\npm.CMD
    pnpm: 9.4.0 - ~\scoop\apps\volta\current\appdata\bin\pnpm.EXE
    bun: 1.1.25 - ~\.bun\bin\bun.EXE
  IDEs:
    VSCode: 0.41.2 - c:\Users\jessa\AppData\Local\Programs\cursor\resources\app\bin\code.CMD
    Visual Studio: 17.11.35303.130 (Visual Studio Community 2022)
  Browsers:
    Edge: Chromium (127.0.2651.86)
    Internet Explorer: 11.0.22621.3527

Used Package Manager

npm

Preview.js logs (check bottom panel in IntelliJ)

[11:38:07.603] ERROR (4176): 500 in endpoint /crawl-file:
[11:38:07.604] ERROR (4176): Cannot read properties of undefined (reading 'length')
    err: {
      "type": "TypeError",
      "message": "Cannot read properties of undefined (reading 'length')",
      "stack":
          TypeError: Cannot read properties of undefined (reading 'length')
              at StringScriptSnapshot.getLength (C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:129325:30)
              at getSnapshotText (C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:130993:33)
              at createLanguageServiceSourceFile (C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:142659:51)
              at acquireOrUpdateDocument (C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:134253:28)
              at Object.acquireDocumentWithKey (C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:134176:14)
              at getOrCreateSourceFileByPath (C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:142913:33)
              at Object.getOrCreateSourceFile (C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:142892:16)
              at C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:142816:44
              at Object.getSourceFileWithCache [as getSourceFile] (C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:118637:26)
              at findSourceFileWorker (C:\Users\USER\AppData\Roaming\JetBrains\WebStorm2024.2\plugins\previewjs\daemon\dist\node_modules\.pnpm\typescript@5.3.3\node_modules\typescript\lib\typescript.js:120939:25)
    }

Browser logs (useful for rendering errors)

No response

Repo link (if available)

No response

Anything else?