Cannot build a next app with Turbopack (Styles were unable to be assigned to a file) #1367
Description
Describe the bug
I'm trying to run my next app with the --turbo flag as it drastically improves build times.
This builds the project using Turbopack. This tool is still in beta, but more than 99% of its tests are passing: https://areweturboyet.com/. I never got any issues in projects that are not using vanilla extract.
Unfortunately running next dev --turbo will cause the app to fail with the following error:
I created this simple reproduction repo, where I just ran create-next-app and installed vanilla extract:
https://github.com/nicolassanmar/vanilla-extract-turbopack-issue/tree/main
Reproduction
https://github.com/nicolassanmar/vanilla-extract-turbopack-issue/tree/main
System Info
System:
OS: Linux 5.15 Zorin OS 16.3
CPU: (8) x64 11th Gen Intel(R) Core(TM) i7-1165G7 @ 2.80GHz
Memory: 4.26 GB / 23.27 GB
Container: Yes
Shell: 5.0.17 - /bin/bash
Binaries:
Node: 18.18.2 - ~/.nvm/versions/node/v18.18.2/bin/node
npm: 9.8.1 - ~/.nvm/versions/node/v18.18.2/bin/npm
pnpm: 8.13.1 - ~/.local/share/pnpm/pnpm
Browsers:
Chrome: 122.0.6261.94
npmPackages:
@vanilla-extract/css: ^1.14.1 => 1.14.1
@vanilla-extract/next-plugin: ^2.3.7 => 2.3.7Used Package Manager
pnpm
Logs
✓ Compiled / in 899ms
⨯ Error: Styles were unable to be assigned to a file. This is generally caused by one of the following:
- You may have created styles outside of a '.css.ts' context
- You may have incorrect configuration. See https://vanilla-extract.style/documentation/getting-started
at Object.getFileScope (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/@[email protected]/node_modules/@vanilla-extract/css/fileScope/dist/vanilla-extract-css-fileScope.cjs.dev.js:35:11)
at generateIdentifier (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/@[email protected]/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.cjs.dev.js:175:49)
at Object.style (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/@[email protected]/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.cjs.dev.js:374:19)
at /home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[root of the server]__87cd9b._.js:125:86
at [project]/styles/vanilla-extract.css.ts [ssr] (ecmascript) (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[root of the server]__87cd9b._.js:129:3)
at instantiateModule (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[turbopack]_runtime.js:488:23)
at getOrInstantiateModuleFromParent (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[turbopack]_runtime.js:539:12)
at esmImport (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[turbopack]_runtime.js:113:20)
at /home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[root of the server]__87cd9b._.js:141:132
at [project]/pages/index.tsx [ssr] (ecmascript) (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[root of the server]__87cd9b._.js:430:3)
at instantiateModule (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[turbopack]_runtime.js:488:23)
at getOrInstantiateModuleFromParent (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[turbopack]_runtime.js:539:12)
at esmImport (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[turbopack]_runtime.js:113:20)
at /home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/node_modules__pnpm_af8e7b._.js:6683:112
at [project]/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/esm/build/templates/pages.js/(INNER_PAGE)/[project]/pages/index.tsx [ssr] (ecmascript) (ecmascript) (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/node_modules__pnpm_af8e7b._.js:6718:3)
at instantiateModule (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[turbopack]_runtime.js:488:23)
at instantiateRuntimeModule (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[turbopack]_runtime.js:547:12)
at Object.getOrInstantiateRuntimeModule (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/chunks/[turbopack]_runtime.js:562:12)
at Object.<anonymous> (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/.next/server/pages/index.js:6:26)
at Module._compile (node:internal/modules/cjs/loader:1256:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
at Module.load (node:internal/modules/cjs/loader:1119:32)
at Module._load (node:internal/modules/cjs/loader:960:12)
at Module.require (node:internal/modules/cjs/loader:1143:19)
at mod.require (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/require-hook.js:65:28)
at require (node:internal/modules/cjs/helpers:119:18)
at requirePage (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/require.js:109:84)
at /home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/load-components.js:98:84
at async loadComponentsImpl (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/load-components.js:98:26)
at async DevServer.findPageComponentsImpl (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/next-server.js:664:36)
at async DevServer.findPageComponents (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/dev/next-dev-server.js:565:20)
at async DevServer.renderPageComponent (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1832:24)
at async DevServer.renderToResponseImpl (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:1882:32)
at async DevServer.pipeImpl (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:895:25)
at async NextNodeServer.handleCatchallRenderRequest (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/next-server.js:269:17)
at async DevServer.handleRequestImpl (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/base-server.js:791:17)
at async /home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/dev/next-dev-server.js:331:20
at async Span.traceAsyncFn (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/trace/trace.js:151:20)
at async DevServer.handleRequest (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/dev/next-dev-server.js:328:24)
at async invokeRender (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-server.js:174:21)
at async handleRequest (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-server.js:353:24)
at async requestHandlerImpl (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-server.js:377:13)
at async Server.requestListener (/home/nicolassanmar/trabajo/repos/vanilla-extract-turbopack-issue/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/lib/start-server.js:140:13) {
page: '/'
}Validations
- Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- The provided reproduction is a minimal reproducible example of the bug.