Compilation error for Next 14.1.0 and p5.js 1.9.0 #60897

msanguineti · 2024-01-19T16:09:53Z

Link to the code that reproduces this issue

https://codesandbox.io/p/sandbox/dry-tree-rnzjq9

To Reproduce

access the sandbox. The code will run and a page will appear.

Current vs. Expected behavior

Expected result:

a page with a 400x400 canvas where a little ball bounces off the walls

Observed:

a compilation error:

$ next dev
   ▲ Next.js 14.1.1-canary.1
   - Local:        http://localhost:3000

 ✓ Ready in 2.2s
 ○ Compiling / ...
 ⨯ ./node_modules/p5/lib/p5.min.js
Module parse failed: Identifier 'o' has already been declared (7314:37)
|                             if (g ? x || (d = !0, w(), x = !0) : d = Boolean(o.first), t = Math.max(0, Math.floor(t)), r = Math.max(0, Math.floor(r)), d) {
|                                 if (!a) throw new Error("First frame must include a { palette } option");
>                                 var [o, h, f, p, m = 8] = [
|                                     v,
|                                     t,

Import trace for requested module:
./node_modules/p5/lib/p5.min.js
./app/p5-error.tsx
 ⨯ ./node_modules/p5/lib/p5.min.js
Module parse failed: Identifier 'o' has already been declared (7314:37)
|                             if (g ? x || (d = !0, w(), x = !0) : d = Boolean(o.first), t = Math.max(0, Math.floor(t)), r = Math.max(0, Math.floor(r)), d) {
|                                 if (!a) throw new Error("First frame must include a { palette } option");
>                                 var [o, h, f, p, m = 8] = [
|                                     v,
|                                     t,

Import trace for requested module:
./node_modules/p5/lib/p5.min.js
./app/p5-error.tsx
<w> [webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: ENOENT: no such file or directory, rename '/workspace/.next/cache/webpack/client-development-fallback/0.pack.gz_' -> '/workspace/.next/cache/webpack/client-development-fallback/0.pack.gz'

Verify canary release

I verified that the issue exists in the latest Next.js canary release

Provide environment information

> NOTE: this is a CodeSandbox machine

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Sun Aug  6 20:05:33 UTC 2023
Binaries:
  Node: 20.9.0
  npm: 9.8.1
  Yarn: 1.22.19
  pnpm: 8.10.2
Relevant Packages:
  next: 14.1.1-canary.1
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.1.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Not sure

Which stage(s) are affected? (Select all that apply)

next dev (local), next build (local)

Additional context

The error only appeared with the 14.1.0 and the canary versions.

Version 14.0.4 was fine.

The text was updated successfully, but these errors were encountered:

hamizjafari · 2024-01-19T17:23:25Z

Solved, solution:
I was able to solve this problem by removing browserslist:[...] of the package.json and I admit that this version is much more optimal.
thanks

frederickk · 2024-01-20T00:48:22Z

I'm getting the same error, but using 14.0.4 I don't have browserList in my package.json and when i added:

"browserslist": [
  "Chrome 118"
]

the problem still persists.

msanguineti · 2024-01-20T07:32:02Z

Solved, solution: I was able to solve this problem by removing browserslist:[...] of the package.json and I admit that this version is much more optimal. thanks

There is no browserslist explicitly defined by me anywhere. Check the linked sandbox code.

msanguineti · 2024-01-20T07:50:34Z

I'm getting the same error, but using 14.0.4 I don't have browserList in my package.json and when i added:
"browserslist": [
  "Chrome 118"
]
the problem still persists.

That's interesting. Would you be kind enough to create a sandbox example with 14.0.4 that fails? Are you using p5 version 1.9.0? Are you using some other libraries as well? Do you use app or pages (might not be relevant after all)? Which version of TypeScript?

ededejr · 2024-01-20T16:50:34Z

Having the same issue with 14.1.0, downgrading to 14.0.4 is the only fix so far

cody-ta · 2024-01-21T08:44:46Z

Having the same issue when upgraded to 14.1.0

joelpelaez · 2024-01-21T19:31:08Z

This issue is not present when compiling using Turbopack, but shows other warning.

 ⨯ ReferenceError: window is not defined
    at 286.core-js/modules/es.array.filter (D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:21022:3274)
    at a (D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:20:28)
    at D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:21:28
    at 275../constants (D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:18942:41)
    at a (D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:20:28)
    at D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:21:28
    at 259../accessibility/color_namer (D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:17238:30)
    at a (D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:20:28)
    at o (D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:26:90)
    at D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:28:7
    at D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:6:83
    at Object.<anonymous> (D:\source\sandbox\.next\server\chunks\node_modules_p5_lib_p5_min_44105b.js:7:2)
    at instantiateModule (D:\source\sandbox\.next\server\chunks\[turbopack]_runtime.js:488:23)
    at getOrInstantiateModuleFromParent (D:\source\sandbox\.next\server\chunks\[turbopack]_runtime.js:539:12)
    at esmImport (D:\source\sandbox\.next\server\chunks\[turbopack]_runtime.js:113:20)
    at D:\source\sandbox\.next\server\chunks\app_557e6a._.js:11:142
    at [project]/app/p5-error.tsx [app-ssr] (ecmascript) (D:\source\sandbox\.next\server\chunks\app_557e6a._.js:61:3)
    at instantiateModule (D:\source\sandbox\.next\server\chunks\[turbopack]_runtime.js:488:23)
    at getOrInstantiateModuleFromParent (D:\source\sandbox\.next\server\chunks\[turbopack]_runtime.js:539:12)
    at commonJsRequire (D:\source\sandbox\.next\server\chunks\[turbopack]_runtime.js:127:20)

This warning seems related to #60644 and #60920, but this message also showns on 14.0.5-canary.19, but it compiles using default bundler with this warning:

 ⨯ node_modules\p5\lib\p5.min.js (2:541645) @ 286.core-js/modules/es.array.filter
 ⨯ ReferenceError: window is not defined
    at __webpack_require__ (D:\source\sandbox\.next\server\webpack-runtime.js:33:42)
    at eval (./app/p5-error.tsx:9:60)
    at (ssr)/./app/p5-error.tsx (D:\source\sandbox\.next\server\app\page.js:140:1)
    at __webpack_require__ (D:\source\sandbox\.next\server\webpack-runtime.js:33:42)

Summary:

14.0.5-canary.19:

next dev works with warning window is not defined
next dev --turbo works with warning window is not defined

14.0.5-canary.20:

next dev doesn't work with error Module parse failed: Identifier 'o' has already been declared (7313:37)
next dev --turbo still works with same "window" warning.

siddharthd0 · 2024-02-09T05:58:05Z

im getting this erorrr, downgrading to nextjs to the prev version didnt work either

isab · 2024-02-15T07:51:16Z

~~I'm still getting this error even when I downgrade to the previous version. I also tried v14.0.3 with no luck.~~

For anyone else that made the same mistake I did. You need to change the version to 14.0.4, NOT ^14.0.4.

3askaal · 2024-02-16T21:45:27Z

@ededejr came across this issue and this worked for me, thx!

Kazizodev · 2024-02-27T10:42:10Z

Im getting this issue from a different node_module package but yes downgrading worked. I really hope they fix this soon

msanguineti added the bug Issue was opened via the bug report template. label Jan 19, 2024

chevsky mentioned this issue Jan 20, 2024

Having a certain browserslist config breaks React imports #60909

Closed

micha31r mentioned this issue Jan 20, 2024

next@14.1.0 is not compatible with p5@1.9.0 dscubed/ds3#3

Open

msanguineti mentioned this issue Jan 26, 2024

p5.js + NextJS compilation error processing/p5.js#6771

Open

17 tasks

jborichevskiy mentioned this issue Jan 31, 2024

Error in nextjs P5-wrapper/react#314

Closed

duidae mentioned this issue Feb 10, 2024

[bug] p5 & next bug @next v14.1.0 duidae/taiwan-fish-fish-fe#2

Open

TOMOQ1024 mentioned this issue Mar 1, 2024

各種ライブラリ等の導入実験 TOMOQ1024/WebApps2#124

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Compilation error for Next 14.1.0 and p5.js 1.9.0 #60897

Compilation error for Next 14.1.0 and p5.js 1.9.0 #60897

msanguineti commented Jan 19, 2024

hamizjafari commented Jan 19, 2024

frederickk commented Jan 20, 2024 •

edited

msanguineti commented Jan 20, 2024 •

edited

msanguineti commented Jan 20, 2024

ededejr commented Jan 20, 2024

cody-ta commented Jan 21, 2024

joelpelaez commented Jan 21, 2024

siddharthd0 commented Feb 9, 2024

isab commented Feb 15, 2024 •

edited

3askaal commented Feb 16, 2024

Kazizodev commented Feb 27, 2024

Compilation error for Next 14.1.0 and p5.js 1.9.0 #60897

Compilation error for Next 14.1.0 and p5.js 1.9.0 #60897

Comments

msanguineti commented Jan 19, 2024

Link to the code that reproduces this issue

To Reproduce

Current vs. Expected behavior

Verify canary release

Provide environment information

Which area(s) are affected? (Select all that apply)

Which stage(s) are affected? (Select all that apply)

Additional context

hamizjafari commented Jan 19, 2024

frederickk commented Jan 20, 2024 • edited

msanguineti commented Jan 20, 2024 • edited

msanguineti commented Jan 20, 2024

ededejr commented Jan 20, 2024

cody-ta commented Jan 21, 2024

joelpelaez commented Jan 21, 2024

siddharthd0 commented Feb 9, 2024

isab commented Feb 15, 2024 • edited

3askaal commented Feb 16, 2024

Kazizodev commented Feb 27, 2024

frederickk commented Jan 20, 2024 •

edited

msanguineti commented Jan 20, 2024 •

edited

isab commented Feb 15, 2024 •

edited