Version

3.2.9

Reproduction link

https://github.com/sodatea/compiler-core-babel-types

Steps to reproduce

git clone https://github.com/sodatea/compiler-core-babel-types.git
cd compiler-core-babel-types
pnpm i
pnpm dev

And you'll see the error log in the browser console.

The issue only exists in the CJS build. The CJS build will be picked by Vite when @vue/compiler-core is an indirect dependency of a CJS-only package. For example, @cypress/vue.

This issue breaks Cypress Component Testing: https://github.com/cypress-io/cypress/issues/17902

What is expected?

No error

What is actually happening?

Uncaught ReferenceError: process is not defined
    at node_modules/.pnpm/@babel+types@7.15.4/node_modules/@babel/types/lib/definitions/core.js (core.js:22)
    at __require (chunk-4SEQJKOJ.js?v=e088fd5a:7)
    at node_modules/.pnpm/@babel+types@7.15.4/node_modules/@babel/types/lib/definitions/index.js (index.js:70)
    at __require (chunk-4SEQJKOJ.js?v=e088fd5a:7)
    at node_modules/.pnpm/@babel+types@7.15.4/node_modules/@babel/types/lib/builders/builder.js (builder.js:8)
    at __require (chunk-4SEQJKOJ.js?v=e088fd5a:7)
    at node_modules/.pnpm/@babel+types@7.15.4/node_modules/@babel/types/lib/builders/generated/index.js (index.js:257)
    at __require (chunk-4SEQJKOJ.js?v=e088fd5a:7)
    at node_modules/.pnpm/@babel+types@7.15.4/node_modules/@babel/types/lib/utils/react/cleanJSXElementLiteralChild.js (cleanJSXElementLiteralChild.js:8)
    at __require (chunk-4SEQJKOJ.js?v=e088fd5a:7)

It is because of this commit: https://github.com/vuejs/vue-next/commit/62f752552a2f8e21228bb1cfc4cb9e63e4a0d2d3#diff-0e15aa4ce958d5d1b4c2bb54dae30b0d1fffd5fe8c63c2bea5eff3269bf7faa0

• When isRefIdentifier is refactored to isReferencedIdentifier, a runtime dependency from @babel/types is introduced (isReferenced).
• @babel/types is not compatible with Vite by default, as it uses the process.env.BABEL_TYPES_8_BREAKING environment variable (Vite only processes common env variables like process.env.NODE_ENV).
• In the versions prior to 3.2.5, though @babel/types is listed as a dependency, only its type definitions are used, so there's no runtime dependency on it, the code referencing process.env.BABEL_TYPES_8_BREAKING never got executed, thus no errors.

I'm not sure in which package should we address this issue and prevent similar ones from happening again.

• Maybe @babel/types can be moved to devDependencies and we only use import types { /* ... */ } from '@babel/types' from now on?
• It can also be fixed in @cypress/vue by shipping an additional ESM bundle for Vite. But I think we should still support the CJS build of @vue/compiler-core in Vite.
• Or, shall we work around this kind of issue in vite or @vitejs/plugin-vue?
• Or, shall we report to upstream Babel packages? (Though, the relevant babel code has been in the repo for more than 1 year. So I don't think they'll take it as a bug).