build: further shave off runtime compile only code

jest.config.js

@@ -4,6 +4,7 @@ module.exports = {
     __DEV__: true,
     __BROWSER__: false,
     __JSDOM__: true,
+    __RUNTIME_COMPILE__: true,
     __FEATURE_OPTIONS__: true,
     __FEATURE_SUSPENSE__: true
   },

package.json

@@ -6,8 +6,8 @@
   "scripts": {
     "dev": "node scripts/dev.js",
     "build": "node scripts/build.js",
-    "size-runtime": "node scripts/build.js runtime-dom -p -f esm-browser",
+    "size-runtime": "node scripts/build.js runtime-dom -p -f global",
-    "size-compiler": "node scripts/build.js compiler-dom -p -f esm-browser",
+    "size-compiler": "node scripts/build.js compiler-dom -p -f global",
     "size": "yarn size-runtime && yarn size-compiler",
     "lint": "prettier --write --parser typescript 'packages/**/*.ts'",
     "test": "jest"

packages/global.d.ts

@@ -2,6 +2,7 @@
 declare var __DEV__: boolean
 declare var __JSDOM__: boolean
 declare var __BROWSER__: boolean
+declare var __RUNTIME_COMPILE__: boolean
 declare var __COMMIT__: string
 
 // Feature flags

packages/runtime-core/src/component.ts

@@ -320,7 +320,7 @@ function finishComponentSetup(
 ) {
   const Component = instance.type as ComponentOptions
   if (!instance.render) {
-    if (Component.template && !Component.render) {
+    if (__RUNTIME_COMPILE__ && Component.template && !Component.render) {
       if (compile) {
         Component.render = compile(Component.template, {
           onError(err: CompilerError) {

packages/runtime-core/src/componentProxy.ts

@@ -48,7 +48,7 @@ const publicPropertiesMap = {
   $options: 'type'
 }
 
-export const PublicInstanceProxyHandlers = {
+export const PublicInstanceProxyHandlers: ProxyHandler<any> = {
   get(target: ComponentInternalInstance, key: string) {
     const { renderContext, data, props, propsProxy } = target
     if (data !== EMPTY_OBJ && hasOwn(data, key)) {
@@ -76,11 +76,7 @@ export const PublicInstanceProxyHandlers = {
     }
     return target.user[key]
   },
-  // this trap is only called in browser-compiled render functions that use
+
-  // `with (this) {}`
-  has(_: any, key: string): boolean {
-    return key[0] !== '_' && !globalsWhitelist.has(key)
-  },
   set(target: ComponentInternalInstance, key: string, value: any): boolean {
     const { data, renderContext } = target
     if (data !== EMPTY_OBJ && hasOwn(data, key)) {
@@ -105,3 +101,11 @@ export const PublicInstanceProxyHandlers = {
     return true
   }
 }
+
+if (__RUNTIME_COMPILE__) {
+  // this trap is only called in browser-compiled render functions that use
+  // `with (this) {}`
+  PublicInstanceProxyHandlers.has = (_: any, key: string): boolean => {
+    return key[0] !== '_' && !globalsWhitelist.has(key)
+  }
+}

rollup.config.js

@@ -76,6 +76,7 @@ function createConfig(output, plugins = []) {
   const isGlobalBuild = /\.global(\.prod)?\.js$/.test(output.file)
   const isBundlerESMBuild = /\.esm\.js$/.test(output.file)
   const isBrowserESMBuild = /esm-browser(\.prod)?\.js$/.test(output.file)
+  const isRuntimeCompileBuild = /^dist\/vue\./.test(output.file)
 
   if (isGlobalBuild) {
     output.name = packageOptions.name
@@ -120,7 +121,8 @@ function createConfig(output, plugins = []) {
         isProductionBuild,
         isBundlerESMBuild,
         (isGlobalBuild || isBrowserESMBuild) &&
-          !packageOptions.enableNonBrowserBranches
+          !packageOptions.enableNonBrowserBranches,
+        isRuntimeCompileBuild
       ),
       ...plugins
     ],
@@ -133,7 +135,12 @@ function createConfig(output, plugins = []) {
   }
 }
 
-function createReplacePlugin(isProduction, isBundlerESMBuild, isBrowserBuild) {
+function createReplacePlugin(
+  isProduction,
+  isBundlerESMBuild,
+  isBrowserBuild,
+  isRuntimeCompileBuild
+) {
   return replace({
     __COMMIT__: `"${process.env.COMMIT}"`,
     __DEV__: isBundlerESMBuild
@@ -143,9 +150,11 @@ function createReplacePlugin(isProduction, isBundlerESMBuild, isBrowserBuild) {
         !isProduction,
     // If the build is expected to run directly in the browser (global / esm-browser builds)
     __BROWSER__: isBrowserBuild,
+    // support compile in browser?
+    __RUNTIME_COMPILE__: isRuntimeCompileBuild,
     // support options?
     // the lean build drops options related code with buildOptions.lean: true
-    __FEATURE_OPTIONS__: !packageOptions.lean,
+    __FEATURE_OPTIONS__: !packageOptions.lean && !process.env.LEAN,
     __FEATURE_SUSPENSE__: true,
     // this is only used during tests
     __JSDOM__: false

scripts/build.js

@@ -28,8 +28,12 @@ const formats = args.formats || args.f
 const devOnly = args.devOnly || args.d
 const prodOnly = !devOnly && (args.prodOnly || args.p)
 const buildAllMatching = args.all || args.a
+const lean = args.lean || args.l
 const commit = execa.sync('git', ['rev-parse', 'HEAD']).stdout.slice(0, 7)
-;(async () => {
+
+run()
+
+async function run() {
   if (!targets.length) {
     await buildAll(allTargets)
     checkAllSizes(allTargets)
@@ -37,7 +41,7 @@ const commit = execa.sync('git', ['rev-parse', 'HEAD']).stdout.slice(0, 7)
     await buildAll(fuzzyMatchTarget(targets, buildAllMatching))
     checkAllSizes(fuzzyMatchTarget(targets, buildAllMatching))
   }
-})()
+}
 
 async function buildAll(targets) {
   for (const target of targets) {
@@ -54,7 +58,6 @@ async function build(target) {
   const env =
     (pkg.buildOptions && pkg.buildOptions.env) ||
     (devOnly ? 'development' : 'production')
-
   await execa(
     'rollup',
     [
@@ -66,7 +69,8 @@ async function build(target) {
         `TARGET:${target}`,
         formats ? `FORMATS:${formats}` : ``,
         args.types ? `TYPES:true` : ``,
-        prodOnly ? `PROD_ONLY:true` : ``
+        prodOnly ? `PROD_ONLY:true` : ``,
+        lean ? `LEAN:true` : ``
       ]
         .filter(Boolean)
         .join(',')
@@ -118,7 +122,7 @@ function checkAllSizes(targets) {
 
 function checkSize(target) {
   const pkgDir = path.resolve(`packages/${target}`)
-  const esmProdBuild = `${pkgDir}/dist/${target}.esm-browser.prod.js`
+  const esmProdBuild = `${pkgDir}/dist/${target}.global.prod.js`
   if (fs.existsSync(esmProdBuild)) {
     const file = fs.readFileSync(esmProdBuild)
     const minSize = (file.length / 1024).toFixed(2) + 'kb'