Zenn
Closed6

opennextを試す

Next.js
Windows
opennext
trhr_coretrhr_core

モチベ

  • 個人開発したNext.jsプロジェクトをCloudflareにデプロイしたい
  • next-on-pagesというnpmパッケージが必要とのことで、試してみるがエラー頻出。pnpmとの相性が良くない？対応方法がわからないため、代替案を探した。
  • opennextとかいうよさげな存在を知ったので試してみる。

そんな感じのレベル感。自分のためのキャッチアップメモになるので、内容は荒い点ご了承ください。

環境

  • node version:22.14.0
  • next: 15.3.1
    • app router
    • generateStaticParamsでSGしている
      • 現状クライアントサイドのみで動作する、シンプルなタイマーアプリのため。
      • （今後の機能追加を踏まえNext.jsを採用している）
trhr_coretrhr_core
  1. Update the package.json file
    までやって、pnpm preview 実行。ビルドが開始された。

以下エラーでた。しんぼりっくりんくの権限エラーかな。Windowsなので。

⚠ Failed to copy traced files for C:\Users\sndwe\dev\iteract-web\.next\server\pages\_app.js [Error: EPERM: operation not permitted, symlink 'C:\Users\sndwe\dev\iteract-web\node_modules\.pnpm\react@19.1.0\node_modules\react' -> 'C:\Users\sndwe\dev\iteract-web\.next\standalone\node_modules\react'] {
  errno: -4048,
  code: 'EPERM',
  syscall: 'symlink',
  path: 'C:\\Users\\sndwe\\dev\\iteract-web\\node_modules\\.pnpm\\react@19.1.0\\node_modules\\react',
  dest: 'C:\\Users\\sndwe\\dev\\iteract-web\\.next\\standalone\\node_modules\\react'
}
 ⚠ Failed to copy traced files for C:\Users\sndwe\dev\iteract-web\.next\server\pages\_error.js [Error: EPERM: operation not permitted, symlink 'C:\Users\sndwe\dev\iteract-web\node_modules\.pnpm\styled-jsx@5.1.6_@babel+core@7.26.10_react@19.1.0\node_modules\styled-jsx' -> 'C:\Users\sndwe\dev\iteract-web\.next\standalone\node_modules\.pnpm\next@15.3.1_@babel+core@7.2_0935266f8bc21613be474333bb18d40a\node_modules\styled-jsx'] {
  errno: -4048,
  code: 'EPERM',
  syscall: 'symlink',
  path: 'C:\\Users\\sndwe\\dev\\iteract-web\\node_modules\\.pnpm\\styled-jsx@5.1.6_@babel+core@7.26.10_react@19.1.0\\node_modules\\styled-jsx',
  dest: 'C:\\Users\\sndwe\\dev\\iteract-web\\.next\\standalone\\node_modules\\.pnpm\\next@15.3.1_@babel+core@7.2_0935266f8bc21613be474333bb18d40a\\node_modules\\styled-jsx'
}
 ⚠ Failed to copy traced files for C:\Users\sndwe\dev\iteract-web\.next\server\pages\_document.js [Error: EPERM: operation not permitted, symlink 'C:\Users\sndwe\dev\iteract-web\node_modules\.pnpm\react@19.1.0\node_modules\react' -> 'C:\Users\sndwe\dev\iteract-web\.next\standalone\node_modules\.pnpm\styled-jsx@5.1.6_@babel+core@7.26.10_react@19.1.0\node_modules\react'] {
  errno: -4048,
  code: 'EPERM',
  syscall: 'symlink',
  path: 'C:\\Users\\sndwe\\dev\\iteract-web\\node_modules\\.pnpm\\react@19.1.0\\node_modules\\react',
  dest: 'C:\\Users\\sndwe\\dev\\iteract-web\\.next\\standalone\\node_modules\\.pnpm\\styled-jsx@5.1.6_@babel+core@7.26.10_react@19.1.0\\node_modules\\react'
}

> Build error occurred
[Error: EPERM: operation not permitted, symlink 'C:\Users\sndwe\dev\iteract-web\node_modules\.pnpm\@next+env@15.3.1\node_modules\@next\env' -> 'C:\Users\sndwe\dev\iteract-web\.next\standalone\node_modules\.pnpm\next@15.3.1_@babel+core@7.2_0935266f8bc21613be474333bb18d40a\node_modules\@next\env'] {
  errno: -4048,
  code: 'EPERM',
  syscall: 'symlink',
  path: 'C:\\Users\\sndwe\\dev\\iteract-web\\node_modules\\.pnpm\\@next+env@15.3.1\\node_modules\\@next\\env',
  dest: 'C:\\Users\\sndwe\\dev\\iteract-web\\.next\\standalone\\node_modules\\.pnpm\\next@15.3.1_@babel+core@7.2_0935266f8bc21613be474333bb18d40a\\node_modules\\@next\\env'
}
 ELIFECYCLE  Command failed with exit code 1.
node:internal/errors:983
  const err = new Error(message);
              ^

Error: Command failed: pnpm build
    at genericNodeError (node:internal/errors:983:15)
    at wrappedFn (node:internal/errors:537:14)
    at checkExecSyncError (node:child_process:882:11)
    at Object.execSync (node:child_process:954:15)
    at buildNextjsApp (file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+aws@3.6.0/node_modules/@opennextjs/aws/dist/build/buildNextApp.js:15:8)
    at build (file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+cloudflare@1.0.1_wrangler@4.14.3/node_modules/@opennextjs/cloudflare/dist/cli/build/build.js:44:9)
    at runCommand (file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+cloudflare@1.0.1_wrangler@4.14.3/node_modules/@opennextjs/cloudflare/dist/cli/index.js:32:20)
    at async file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+cloudflare@1.0.1_wrangler@4.14.3/node_modules/@opennextjs/cloudflare/dist/cli/index.js:43:1 {
  status: 1,
  signal: null,
  output: [ null, null, null ],
  pid: 19276,
  stdout: null,
  stderr: null
}

Node.js v22.14.0
 ELIFECYCLE  Command failed with exit code 1.
trhr_coretrhr_core

ビルド自体は無事完了。
次のエラー。
WARN OpenNext is not fully compatible with Windows.
WARN For optimal performance, it is recommended to use Windows Subsystem for Linux (WSL).
WARN While OpenNext may function on Windows, it could encounter unpredictable failures during runtime.

Windowsだめかあ・・・？

√ No `wrangler.(toml|json|jsonc)` config file found, do you want to create one? (Y/n) · true

OpenNext build complete.

┌───────────────────────────────┐
│ OpenNext — Cloudflare preview │
└───────────────────────────────┘

WARN OpenNext is not fully compatible with Windows.
WARN For optimal performance, it is recommended to use Windows Subsystem for Linux (WSL).
WARN While OpenNext may function on Windows, it could encounter unpredictable failures during runtime.

Populating R2 incremental cache...
Using vars defined in .dev.vars
file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+cloudflare@1.0.1_wrangler@4.14.3/node_modules/@opennextjs/cloudflare/dist/cli/commands/populate-cache.js:40
                throw new Error(`Invalid path for a Cache Asset file: ${relativePath}`);
                      ^

Error: Invalid path for a Cache Asset file: \\?\C:\Users\sndwe\dev\iteract-web\.open-next\cache\WYnGn84_44IDdsfPMBa9P\_not-found.cache
    at getCacheAssets (file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+cloudflare@1.0.1_wrangler@4.14.3/node_modules/@opennextjs/cloudflare/dist/cli/commands/populate-cache.js:40:23)
    at populateR2IncrementalCache (file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+cloudflare@1.0.1_wrangler@4.14.3/node_modules/@opennextjs/cloudflare/dist/cli/commands/populate-cache.js:70:20)
    at async populateCache (file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+cloudflare@1.0.1_wrangler@4.14.3/node_modules/@opennextjs/cloudflare/dist/cli/commands/populate-cache.js:146:17)
    at async preview (file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+cloudflare@1.0.1_wrangler@4.14.3/node_modules/@opennextjs/cloudflare/dist/cli/commands/preview.js:4:5)
    at async file:///C:/Users/sndwe/dev/iteract-web/node_modules/.pnpm/@opennextjs+cloudflare@1.0.1_wrangler@4.14.3/node_modules/@opennextjs/cloudflare/dist/cli/index.js:43:1

Node.js v22.14.0
 ELIFECYCLE  Command failed with exit code 1.
trhr_coretrhr_core

はいｗ
ＷＳＬが良いカナ😓（先に読め）

Windowsがダメということが分かったのでいったんクローズする。

https://opennext.js.org/cloudflare#windows-support

Windows support
OpenNext can be used on Windows systems but Windows full support is not guaranteed because:
Next.js tooling itself has Windows support issues and OpenNext is built on these tools
the OpenNext team has limited capacity and fully supporting Windows (given the point above) has been determined to be a lower priority, thus the effort and testing on Windows is limited
Given the above, you can develop your application under Windows at your own risk. If you don't have an alternative we recommend either:

このスクラップは4ヶ月前にクローズされました