Turbopack build feedback #77721
Replies: 105 comments 125 replies
-
|
when creating a standalone build and starting with just |
Beta Was this translation helpful? Give feedback.
-
|
This is no longer the case when using the latest canary release (that is going out as 15.3 soon). |
Beta Was this translation helpful? Give feedback.
-
|
why does with running however, running |
Beta Was this translation helpful? Give feedback.
-
|
Are you asking about the larger bundle size or the |
Beta Was this translation helpful? Give feedback.
-
thanks that explains it. |
Beta Was this translation helpful? Give feedback.
-
|
btw will turbopack have a replacement for webpack's bundle-analyzer? |
Beta Was this translation helpful? Give feedback.
-
|
@stefanprobst, we need a more polished long-term solution, but for now you can run See #81318 for details. |
Beta Was this translation helpful? Give feedback.
-
|
turbopack build does not correctly resolve fonts from next/font - #77861 |
Beta Was this translation helpful? Give feedback.
-
|
Did some digging into this and it seems to only happen with |
Beta Was this translation helpful? Give feedback.
-
|
next build --turbo with nextjs 15.3.0 generates chunks with invalid filenames on Windows. |
Beta Was this translation helpful? Give feedback.
-
|
Same error in 16.0.3. Is there a workaround for this? |
Beta Was this translation helpful? Give feedback.
-
I used the following in {
"scripts": {
"dev": "next dev --webpack",
"build": "next build --webpack",
"start": "next start"
}
} |
Beta Was this translation helpful? Give feedback.
-
|
same error in |
Beta Was this translation helpful? Give feedback.
-
any update on this fix @timneutkens ? |
Beta Was this translation helpful? Give feedback.
-
|
The fix for this landed in #88273 |
Beta Was this translation helpful? Give feedback.
-
import jackson from "@/server/services/jackson";
import { redirect } from "next/navigation";
export async function POST(req: Request) {
const { oauthController } = await jackson();
const formData = await req.formData();
const { redirect_url } = await oauthController.samlResponse({
RelayState: formData.get("RelayState") as string,
SAMLResponse: formData.get("SAMLResponse") as string,
});
redirect(redirect_url as string);
}import { clientEnv } from "@/env/client";
import { createUrl } from "@/lib/utils";
import jackson, {
type IConnectionAPIController,
type IDirectorySyncController,
type IOAuthController,
type ISPSSOConfig,
type JacksonOption,
type OIDCAuthzResponsePayload,
} from "@boxyhq/saml-jackson";
import config from "../db/config";
export type { OIDCAuthzResponsePayload };
interface Global {
apiController?: IConnectionAPIController;
oauthController?: IOAuthController;
directorySync?: IDirectorySyncController;
spConfig?: ISPSSOConfig;
}
const g: Global = global as unknown as Global;
const externalUrl = createUrl.subdomain("admin-cms").path();
const opts: JacksonOption = {
externalUrl: externalUrl,
samlAudience: clientEnv.NEXT_PUBLIC_APP_NAME,
samlPath: "/api/sso/acs",
oidcPath: "/api/sso/callback",
db: {
engine: "sql",
type: "mysql",
url: config.primary,
},
openid: {},
noAnalytics: true,
};
let apiController: IConnectionAPIController;
let oauthController: IOAuthController;
let directorySync: IDirectorySyncController;
let spConfig: ISPSSOConfig;
export default async function init() {
if (
!g.apiController ||
!g.oauthController ||
!g.directorySync ||
!g.spConfig
) {
const ret = await jackson(opts);
apiController = ret.apiController;
oauthController = ret.oauthController;
directorySync = ret.directorySyncController;
spConfig = ret.spConfig;
g.apiController = apiController;
g.oauthController = oauthController;
g.directorySync = directorySync;
g.spConfig = spConfig;
} else {
apiController = g.apiController;
oauthController = g.oauthController;
directorySync = g.directorySync;
spConfig = g.spConfig;
}
return {
apiController,
oauthController,
directorySync,
spConfig,
};
} |
Beta Was this translation helpful? Give feedback.
-
|
I'm having the same issue. Next 15.3.1 |
Beta Was this translation helpful? Give feedback.
-
|
Any update on this? I'm also having the same issue on Next 15.3.2. |
Beta Was this translation helpful? Give feedback.
-
|
I tested in the Next.js 15.4.0-canary.63 version, and it's now working properly. next build --turbopack builds in 36 seconds. 
next build uncached builds in 1 minute 23 seconds. 
|
Beta Was this translation helpful? Give feedback.
-
|
We are from LobeHub Team and building LobeChat with nextjs. I have tested the building with turbopack now and It's amazing fast! 
And Here is a compare of webpack and turbopack:
You can see turbopack reduce 60% building time! But there still an issue with integate with serwist: serwist/serwist#54 . Can wait to move to turbopack after this integration! |
Beta Was this translation helpful? Give feedback.
-
Beta Was this translation helpful? Give feedback.
-
|
Turbo build production fails with Prisma (tried on both 6.5.0 and 6.6.0 using the prisma-client-js generator): prisma schema folder structure prisma loaded in the frontend like this builds all ok without the turbo flag, and next dev --turbo also works fine |
Beta Was this translation helpful? Give feedback.
-
|
can you confirm that downgrading to 15.4.0-canary.35 breaks it again ? Be interested to know which commit fixes it ! |
Beta Was this translation helpful? Give feedback.
-
|
My build was completed successfully on 15.4.0-canary.35. |
Beta Was this translation helpful? Give feedback.
-
|
you know what my next comment will be haha |
Beta Was this translation helpful? Give feedback.
-
|
looks possibly like it was this commit in canary-28 this hopefully fixes it |
Beta Was this translation helpful? Give feedback.
-
|
I've checked, it's fixed in canary-28. |
Beta Was this translation helpful? Give feedback.
-
Build Performance Comparison
|
Beta Was this translation helpful? Give feedback.
-
|
خیلیییی سریعه 🔥🔥 |
Beta Was this translation helpful? Give feedback.
-
|
I with my small project don't see any performance benefits. Are we only supposed to see the benefits in bigger projects? I have even tried running the build command multiple times to see if i would get better results without any luck. I ran each of these with a clean build first. Hardware: running without > next build
▲ Next.js 15.3.0
- Experiments (use with caution):
✓ useCache
Creating an optimized production build ...
✓ Compiled successfully in 1000ms
✓ Linting and checking validity of types
✓ Collecting page data
✓ Generating static pages (6/6)
✓ Collecting build traces
✓ Finalizing page optimization
Route (app) Size First Load JS
┌ ƒ / 572 B 372 kB
├ ƒ /_not-found 990 B 105 kB
└ ƒ /login 572 B 372 kB
+ First Load JS shared by all 104 kB
├ chunks/1684-3cc8d39bf08bda7e.js 46.4 kB
├ chunks/4bd1b696-79901f1c062801da.js 53.2 kB
└ other shared chunks (total) 4.83 kB
ƒ Middleware 33.3 kB
ƒ (Dynamic) server-rendered on demand
npm run build 15.84s user 2.25s system 183% cpu 9.886 totalhyperfine benchmark running with > next build --turbopack
⚠ The config property `experimental.turbo` is deprecated. Move this setting to `config.turbopack` as Turbopack is now stable.
▲ Next.js 15.3.0 (Turbopack)
- Experiments (use with caution):
· turbo
✓ useCache
Creating an optimized production build ...
✓ Compiled successfully in 2.9s
✓ Linting and checking validity of types
✓ Collecting page data
✓ Generating static pages (6/6)
✓ Collecting build traces
✓ Finalizing page optimization
Route (app) Size First Load JS
┌ ƒ / 0 B 420 kB
├ ƒ /_not-found 0 B 420 kB
└ ƒ /login 0 B 420 kB
+ First Load JS shared by all 422 kB
├ chunks/1fa3394cc56fb597.js 77.1 kB
├ chunks/780cf8f2a2a5b7ec.js 13.1 kB
├ chunks/7e8ef395dd44ad63.js 270 kB
├ chunks/e694e57256351634.js 18.9 kB
└ other shared chunks (total) 42.9 kB
ƒ Middleware 50.5 kB
ƒ (Dynamic) server-rendered on demand
⚠ Support for Turbopack builds is experimental. We don't recommend deploying mission-critical applications to production.
- Turbopack currently always builds production sourcemaps for the browser. This will include project sourcecode if deployed to production.
- It is expected that your bundle size might be different from `next build` with webpack. This will be improved as we work towards stability.
- This build is without disk caching; subsequent builds will become faster when disk caching becomes available.
- When comparing output to webpack builds, make sure to first clear the Next.js cache by deleting the `.next` directory.
Provide feedback for Turbopack builds at https://github.com/vercel/next.js/discussions/77721
npm run build 22.58s user 3.21s system 237% cpu 10.879 totalhyperfine benchmark |
Beta Was this translation helpful? Give feedback.
-
|
Did you delete |
Beta Was this translation helpful? Give feedback.
-
|
Hi, I actually did delete the .next folder between runs. That's what I ment by "I ran each of these with a clean build first.". I had the same thoughts as you to begin with and ended up running the benchmarks more than 3 times :) |
Beta Was this translation helpful? Give feedback.
-
|
Yeah fair, given this app is super small not expecting much wins, it compiles with webpack in <1s already. Could you share the project so I can compare and check why it takes longer with Turbopack. If you have e.g. Tailwind that could be the reason because we have to boot a separate Node.js process for it. |
Beta Was this translation helpful? Give feedback.
-
|
Probably some unhandled cases in 
After investigating the reason, it is because dynamic imports in a route handler that referenced client components |
Beta Was this translation helpful? Give feedback.
-
|
Sounds like the same as #77036 |
Beta Was this translation helpful? Give feedback.
-
|
It is a vast improvement from webpack. In Webpack it takes 10 mins to compile and with |
Beta Was this translation helpful? Give feedback.
-
|
Using Turbo with Reproduction: https://github.com/remcohaszing/turbo-markdown-error |
Beta Was this translation helpful? Give feedback.
-
|
Can we turn off Source maps manually? |
Beta Was this translation helpful? Give feedback.
-
|
We ran into two problems which directly crash the build (15.3.1-canary.8) Turbopack crashes with SWC plugins when using absolute paths in swcPlugins configuration #78156 SWC plugin context in Turbopack includes only basename instead of full path #78181 |
Beta Was this translation helpful? Give feedback.
-
|
Bundle size with Turbopack is 4.6x larger than Webpack!! Please see this discussion (last comment) for my initial investigation into what is happening (same dependencies/code bundled into multiple different js files): #86967 |
Beta Was this translation helpful? Give feedback.
-
|
I am using SASS (.scss) files for some of my global styles. My SASS files structure is like following, Now, in the I have another So technically it is able to find the I am not facing this issue when using Webpack. I am not sure if I have to configure something different if I want same behavior with Turbopack. |
Beta Was this translation helpful? Give feedback.
-
|
Does it affect those on macOS? Seems related to my issue above. |
Beta Was this translation helpful? Give feedback.
-
|
I have one update on this. In the above message I mentioned that I have I created a new Next JS project and tried to achieve this in that with fresh setup. But I got error in that too. So I changed that line like below: So now I am importing the file without |
Beta Was this translation helpful? Give feedback.
-
|
@philipbushnell-valtech I tried running my project on macOS and there were no SASS file related errors. But I had some other import errors so, couldn't say if it works completely or not. |
Beta Was this translation helpful? Give feedback.
-
|
I think also the behavior of the "Package X can't be external" warning can be a bit weird in a monorepo context. |
Beta Was this translation helpful? Give feedback.
-
|
I would really like to strongly lobby for exposing the css module hash generation via lightning css in turbopack settings. an app i work has a very solid use case where css modules need to be named just so, and lightningcss exposes this via: cssModules: {
pattern: 'my-company-[name]-[hash]-[local]',
}Would be fantastic if this was configurable in the next config |
Beta Was this translation helpful? Give feedback.
-
|
Still unable to use Turbopack with MikroORM on Nextjs 16.1.0 even though emitDecoratorMetadata is enabled. I get this error when querying db on my API's in Vercel (Production):
No issues with Webpack. |
Beta Was this translation helpful? Give feedback.
-
|
I just upgraded Nextjs 16 and had to add the |
Beta Was this translation helpful? Give feedback.
-
|
Cannot use Turbopack in a project with |
Beta Was this translation helpful? Give feedback.
-
|
For the projects we work on, we use SASS in CSS modules and export CSS variables to JavaScript quite often, to provide extra functionality such as reuse in hooks and components. As such, we're unable to use Turbopack with our projects, and anticipate that we will remain on Webpack for the foreseeable future. |
Beta Was this translation helpful? Give feedback.
-
|
We cannot make the switch to Turbopack because it doesn't support Vanilla Extract |
Beta Was this translation helpful? Give feedback.
-
|
I am unable to switch to
to make it work with
This works fine in |
Beta Was this translation helpful? Give feedback.
-
|
Turbopack doesn't work with Bazel sandboxes. #89549 |
Beta Was this translation helpful? Give feedback.
-
|
Hi Please help me we have next js appliaction we are getting error if we are open domin first time showing error :Application error: a client-side exception has occurred while loading (domin name) (see the browser console for more information). how to fix |
Beta Was this translation helpful? Give feedback.
-
|
Please share your browser console logs (filtered) |
Beta Was this translation helpful? Give feedback.
-
|
browser console logs GET https://www.dominname.com/images/godaddy-siteseal-logo_result.webp net::ERR_HTTP2_PROTOCOL_ERRORUnderstand this error |
Beta Was this translation helpful? Give feedback.
-
|
@Veerpalakvm from what I can see, your app is using Webpack. Since this discussion focuses on Turbopack specific behavior, the issue you’re encountering might be unrelated to what’s being tracked here. |
Beta Was this translation helpful? Give feedback.
-
|
we are not using Webpack but we are fasing same issue live production : console logs |
Beta Was this translation helpful? Give feedback.
-
|
I upgraded my team's project from Next.js 14 to Next.js 16 (as well as upgrading ESLint and TypeScript ESLint to the latest major versions). The application uses the Pages Router, not the App Router. Everything seemed to be working fine (aka the app ran with no issues when using This issue did not occur after upgrading to Next 15. Only when upgrading from Next 15 to Next 16. Looking back through this discussion, I see that @wojtekmaj had a similar error, though I think they may have been on Next 15 when seeing it: #77721 (reply in thread). I've investigated the code to see if there are circular dependencies, even installed Madge to check it, and neither I nor Madge detected any. For context, as part of the upgrade, I removed the following webpack configuration from our So far, the only way I have discovered to bypass these errors and get the application working properly with a production build is by adding that webpack config back into the I don't know how to create a minimal repro for this due to app complexity and my not knowing what is causing this issue. |
Beta Was this translation helpful? Give feedback.
-
|
I have discovered that it is possible to bypass the spinner loading state and get the page to render by removing the |
Beta Was this translation helpful? Give feedback.
and others
Uh oh!
There was an error while loading. Please reload this page.
-
Thread for posting feedback about
next build --turbopack.Beta Was this translation helpful? Give feedback.
All reactions