build: custom const enum processing

Author: yyx990803

.eslintrc.js

@@ -17,13 +17,15 @@ module.exports = {
     ],
     // most of the codebase are expected to be env agnostic
     'no-restricted-globals': ['error', ...DOMGlobals, ...NodeGlobals],
-    // since we target ES2015 for baseline support, we need to forbid object
-    // rest spread usage in destructure as it compiles into a verbose helper.
-    // TS now compiles assignment spread into Object.assign() calls so that
-    // is allowed.
+
     'no-restricted-syntax': [
       'error',
+      // since we target ES2015 for baseline support, we need to forbid object
+      // rest spread usage in destructure as it compiles into a verbose helper.
       'ObjectPattern > RestElement',
+      // tsc compiles assignment spread into Object.assign() calls, but esbuild
+      // still generates verbose helpers, so spread assignment is also prohiboted
+      'ObjectExpression > SpreadElement',
       'AwaitExpression'
     ]
   },

package.json

@@ -54,6 +54,7 @@
     "node": ">=16.11.0"
   },
   "devDependencies": {
+    "@babel/parser": "^7.20.15",
     "@babel/types": "^7.20.7",
     "@esbuild-plugins/node-modules-polyfill": "^0.1.4",
     "@microsoft/api-extractor": "~7.20.0",
@@ -83,6 +84,7 @@
     "jsdom": "^21.1.0",
     "lint-staged": "^10.2.10",
     "lodash": "^4.17.15",
+    "magic-string": "^0.27.0",
     "marked": "^4.0.10",
     "minimist": "^1.2.0",
     "npm-run-all": "^4.1.5",

packages/compiler-ssr/src/errors.ts

@@ -17,11 +17,22 @@ export function createSSRCompilerError(
 }
 
 export const enum SSRErrorCodes {
-  X_SSR_UNSAFE_ATTR_NAME = DOMErrorCodes.__EXTEND_POINT__,
+  X_SSR_UNSAFE_ATTR_NAME = 62 /* DOMErrorCodes.__EXTEND_POINT__ */,
   X_SSR_NO_TELEPORT_TARGET,
   X_SSR_INVALID_AST_NODE
 }
 
+if (__TEST__) {
+  // esbuild cannot infer const enum increments if first value is from another
+  // file, so we have to manually keep them in sync. this check ensures it
+  // errors out if there are collisions.
+  if (SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME < DOMErrorCodes.__EXTEND_POINT__) {
+    throw new Error(
+      'SSRErrorCodes need to be updated to match extension point from core DOMErrorCodes.'
+    )
+  }
+}
+
 export const SSRErrorMessages: { [code: number]: string } = {
   [SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME]: `Unsafe attribute name for SSR.`,
   [SSRErrorCodes.X_SSR_NO_TELEPORT_TARGET]: `Missing the 'to' prop on teleport element.`,

packages/reactivity/src/effect.ts

@@ -248,10 +248,14 @@ export function trackEffects(
     dep.add(activeEffect!)
     activeEffect!.deps.push(dep)
     if (__DEV__ && activeEffect!.onTrack) {
-      activeEffect!.onTrack({
-        effect: activeEffect!,
-        ...debuggerEventExtraInfo!
-      })
+      activeEffect!.onTrack(
+        extend(
+          {
+            effect: activeEffect!
+          },
+          debuggerEventExtraInfo!
+        )
+      )
     }
   }
 }

packages/reactivity/src/index.ts

@@ -28,7 +28,7 @@ export {
   shallowReadonly,
   markRaw,
   toRaw,
-  ReactiveFlags,
+  ReactiveFlags /* @remove */,
   type Raw,
   type DeepReadonly,
   type ShallowReactive,
@@ -66,4 +66,7 @@ export {
   getCurrentScope,
   onScopeDispose
 } from './effectScope'
-export { TrackOpTypes, TriggerOpTypes } from './operations'
+export {
+  TrackOpTypes /* @remove */,
+  TriggerOpTypes /* @remove */
+} from './operations'

packages/runtime-core/src/apiCreateApp.ts

@@ -22,7 +22,7 @@ import { warn } from './warning'
 import { createVNode, cloneVNode, VNode } from './vnode'
 import { RootHydrateFunction } from './hydration'
 import { devtoolsInitApp, devtoolsUnmountApp } from './devtools'
-import { isFunction, NO, isObject } from '@vue/shared'
+import { isFunction, NO, isObject, extend } from '@vue/shared'
 import { version } from '.'
 import { installAppCompatProperties } from './compat/global'
 import { NormalizedPropsOptions } from './componentProps'
@@ -193,7 +193,7 @@ export function createAppAPI<HostElement>(
 ): CreateAppFunction<HostElement> {
   return function createApp(rootComponent, rootProps = null) {
     if (!isFunction(rootComponent)) {
-      rootComponent = { ...rootComponent }
+      rootComponent = extend({}, rootComponent)
     }
 
     if (rootProps != null && !isObject(rootProps)) {

packages/runtime-core/src/apiWatch.ts

@@ -22,7 +22,8 @@ import {
   remove,
   isMap,
   isSet,
-  isPlainObject
+  isPlainObject,
+  extend
 } from '@vue/shared'
 import {
   currentInstance,
@@ -94,7 +95,7 @@ export function watchPostEffect(
   return doWatch(
     effect,
     null,
-    __DEV__ ? { ...options, flush: 'post' } : { flush: 'post' }
+    __DEV__ ? extend({}, options as any, { flush: 'post' }) : { flush: 'post' }
   )
 }
 
@@ -105,7 +106,7 @@ export function watchSyncEffect(
   return doWatch(
     effect,
     null,
-    __DEV__ ? { ...options, flush: 'sync' } : { flush: 'sync' }
+    __DEV__ ? extend({}, options as any, { flush: 'sync' }) : { flush: 'sync' }
   )
 }
 

packages/runtime-core/src/componentProps.ts

@@ -522,7 +522,7 @@ export function normalizePropsOptions(
       if (validatePropName(normalizedKey)) {
         const opt = raw[key]
         const prop: NormalizedProp = (normalized[normalizedKey] =
-          isArray(opt) || isFunction(opt) ? { type: opt } : { ...opt })
+          isArray(opt) || isFunction(opt) ? { type: opt } : extend({}, opt))
         if (prop) {
           const booleanIndex = getTypeIndex(Boolean, prop.type)
           const stringIndex = getTypeIndex(String, prop.type)

pnpm-lock.yaml

@@ -12,6 +12,8 @@ import terser from '@rollup/plugin-terser'
 import esbuild from 'rollup-plugin-esbuild'
 import alias from '@rollup/plugin-alias'
 import { entries } from './scripts/aliases.mjs'
+import { constEnum } from './scripts/const-enum.mjs'
+import { writeFileSync } from 'node:fs'
 
 if (!process.env.TARGET) {
   throw new Error('TARGET package must be specified via --environment flag.')
@@ -31,6 +33,8 @@ const pkg = require(resolve(`package.json`))
 const packageOptions = pkg.buildOptions || {}
 const name = packageOptions.filename || path.basename(packageDir)
 
+const [enumPlugin, enumDefines] = await constEnum()
+
 const outputConfigs = {
   'esm-bundler': {
     file: resolve(`dist/${name}.esm-bundler.js`),
@@ -175,7 +179,7 @@ function createConfig(format, output, plugins = []) {
   // esbuild define is a bit strict and only allows literal json or identifiers
   // so we still need replace plugin in some cases
   function resolveReplace() {
-    const replacements = {}
+    const replacements = { ...enumDefines }
 
     if (isProductionBuild && isBrowserBuild) {
       Object.assign(replacements, {
@@ -282,6 +286,7 @@ function createConfig(format, output, plugins = []) {
       alias({
         entries
       }),
+      enumPlugin,
       ...resolveReplace(),
       esbuild({
         tsconfig: path.resolve(__dirname, 'tsconfig.json'),