Skip to content

fix: add serverExternalPackages to Next.js template for bundler compatibility#1024

Open
mvanhorn wants to merge 1 commit intocoinbase:mainfrom
mvanhorn:osc/929-next16-bundling
Open

fix: add serverExternalPackages to Next.js template for bundler compatibility#1024
mvanhorn wants to merge 1 commit intocoinbase:mainfrom
mvanhorn:osc/929-next16-bundling

Conversation

@mvanhorn
Copy link

Description

Adds serverExternalPackages to the create-onchain-agent Next.js template to fix build failures with Next.js 16 (Turbopack and Webpack).

Closes #929

Problem

Next.js 16's Turbopack aggressively bundles server-side dependencies including @noble/hashes. The ESM exports get incorrectly tree-shaken during bundling, causing a runtime TypeError: Y is not a function when keccak256 is called via viem (a transitive dependency of AgentKit).

The error appears at build time during page data collection:

TypeError: Y is not a function
    at @noble/hashes/esm/sha3.js
    at viem/_esm/utils/hash/keccak256.js

This affects both Turbopack and Webpack bundlers in Next.js 16.

Solution

Adding @noble/hashes, @noble/curves, @scure/bip39, and @scure/bip32 to serverExternalPackages in next.config.js tells Next.js to skip bundling these packages and use Node.js require() instead. This avoids the ESM/CJS interop issue that breaks the crypto libraries.

The fix is applied to typescript/create-onchain-agent/templates/next/next.config.js so all new projects created with npm create onchain-agent@latest get the correct config.

Users with existing projects should add the same config:

const nextConfig = {
  serverExternalPackages: ["@noble/hashes", "@noble/curves", "@scure/bip39", "@scure/bip32"],
};

Tests

This is a configuration change in the project template. The fix was verified by reproducing the issue described in #929 and confirming the build succeeds with serverExternalPackages set.

Checklist

  • I have formatted and linted my code
  • All new and existing tests pass
  • My commits are signed (required for merge)
  • I added a changelog fragment for user-facing changes

This contribution was developed with AI assistance (Claude Code).

…tibility

Next.js 16 (Turbopack and Webpack) breaks when bundling @noble/hashes
for server-side rendering. The ESM exports of @noble/hashes get
incorrectly tree-shaken, causing "TypeError: Y is not a function"
at runtime when keccak256 is called via viem.

Adding these packages to serverExternalPackages tells Next.js to
skip bundling them and use Node.js require() instead, which resolves
the ESM/CJS interop issue.
@mvanhorn mvanhorn requested a review from murrlincoln as a code owner March 20, 2026 01:31
@cb-heimdall
Copy link

🟡 Heimdall Review Status

Requirement Status More Info
Reviews 🟡 0/1
Denominator calculation
Show calculation
1 if user is bot 0
1 if user is external 0
2 if repo is sensitive 0
From .codeflow.yml 1
Additional review requirements
Show calculation
Max 0
0
From CODEOWNERS 0
Global minimum 0
Max 1
1
1 if commit is unverified 1
Sum 2

@mvanhorn mvanhorn mentioned this pull request Mar 20, 2026
2 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

Next 16 bundling issue

2 participants