troika icon indicating copy to clipboard operation
troika copied to clipboard

Runtime error: 'webgl-sdf-generator' does not contain a default export (imported as 'createSDFGenerator').

Open ChristopherTrimboli opened this issue 1 year ago • 1 comments

Next.js 14.0.3

import { Text } from "@react-three/drei";

 ⨯ ReferenceError: exports is not defined
    at __webpack_require__ (/home/cjft/Documents/github/lalaland/lalaland-app/.next/server/edge-runtime-webpack.js:37:33)
    at fn (/home/cjft/Documents/github/lalaland/lalaland-app/.next/server/edge-runtime-webpack.js:318:21)
    at __webpack_require__ (/home/cjft/Documents/github/lalaland/lalaland-app/.next/server/edge-runtime-webpack.js:37:33)
    at fn (/home/cjft/Documents/github/lalaland/lalaland-app/.next/server/edge-runtime-webpack.js:318:21)
 ⚠ ./node_modules/troika-three-text/dist/troika-three-text.esm.js
Attempted import error: 'webgl-sdf-generator' does not contain a default export (imported as 'createSDFGenerator').

Import trace for requested module:
./node_modules/troika-three-text/dist/troika-three-text.esm.js
./node_modules/@react-three/drei/core/Text.js
./node_modules/@react-three/drei/index.js
./app/tv/TvScene.tsx
./app/tv/ClientPage.tsx
./app/tv/page.tsx
 ⚠ ./node_modules/troika-three-text/dist/troika-three-text.esm.js
Attempted import error: 'webgl-sdf-generator' does not contain a default export (imported as 'createSDFGenerator').

Import trace for requested module:
./node_modules/troika-three-text/dist/troika-three-text.esm.js
./node_modules/@react-three/drei/core/Text.js
./node_modules/@react-three/drei/index.js
./app/components/KeyboardControls.tsx
./app/tv/ClientPage.tsx
./app/tv/page.tsx

I tried turning off edge. Used just use client. No difference.

three version: 0.160.0 @react-three/fiber version: 8.15.13

My Text code is pretty simple:

                <Text
                  color="red"
                  anchorX={"center"}
                  anchorY={-0.6}
                  fontSize={0.15}
                  maxWidth={3}
                  ref={virtualTextRef}
                >
                  {currentText}
                </Text>

It builds and compiles, deploys to Vercel, but getting runtime logs and throwing errors in some client.

ChristopherTrimboli avatar Jan 05 '24 15:01 ChristopherTrimboli

I also --legacy-peer-deps installed... no difference on downgraded three versions.

ChristopherTrimboli avatar Jan 05 '24 17:01 ChristopherTrimboli

In case anyone happens to end up here, this was in fact a bug in next.js 14.0.3, and was fixed in 14.0.4 in this PR

lachlansleight avatar Jul 24 '24 10:07 lachlansleight

Thank you @lachlansleight!

lojjic avatar Jul 24 '24 14:07 lojjic