From 82b5978e9ccd42d9b320583226025e6a081d25d1 Mon Sep 17 00:00:00 2001 From: Evan You Date: Mon, 14 Oct 2019 01:08:00 -0400 Subject: [PATCH] build: further shave off runtime compile only code --- jest.config.js | 1 + package.json | 4 ++-- packages/global.d.ts | 1 + packages/runtime-core/src/component.ts | 2 +- packages/runtime-core/src/componentProxy.ts | 16 ++++++++++------ rollup.config.js | 15 ++++++++++++--- scripts/build.js | 14 +++++++++----- 7 files changed, 36 insertions(+), 17 deletions(-) diff --git a/jest.config.js b/jest.config.js index fc8cb8e4..f1147e27 100644 --- a/jest.config.js +++ b/jest.config.js @@ -4,6 +4,7 @@ module.exports = { __DEV__: true, __BROWSER__: false, __JSDOM__: true, + __RUNTIME_COMPILE__: true, __FEATURE_OPTIONS__: true, __FEATURE_SUSPENSE__: true }, diff --git a/package.json b/package.json index b83d4927..d0f6d316 100644 --- a/package.json +++ b/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-compiler": "node scripts/build.js compiler-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 global", "size": "yarn size-runtime && yarn size-compiler", "lint": "prettier --write --parser typescript 'packages/**/*.ts'", "test": "jest" diff --git a/packages/global.d.ts b/packages/global.d.ts index 6741396a..c7e0779a 100644 --- a/packages/global.d.ts +++ b/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 diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts index 08cc7cbe..d9e1e9b9 100644 --- a/packages/runtime-core/src/component.ts +++ b/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) { diff --git a/packages/runtime-core/src/componentProxy.ts b/packages/runtime-core/src/componentProxy.ts index 332b645d..02a2ca2d 100644 --- a/packages/runtime-core/src/componentProxy.ts +++ b/packages/runtime-core/src/componentProxy.ts @@ -48,7 +48,7 @@ const publicPropertiesMap = { $options: 'type' } -export const PublicInstanceProxyHandlers = { +export const PublicInstanceProxyHandlers: ProxyHandler = { 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) + } +} diff --git a/rollup.config.js b/rollup.config.js index d71ef483..9eeca408 100644 --- a/rollup.config.js +++ b/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 diff --git a/scripts/build.js b/scripts/build.js index 2e576d7a..fbf1c938 100644 --- a/scripts/build.js +++ b/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'