feat: defineExpose() support

Author: yyx990803

Diff for: packages/compiler-sfc/src/compileScript.ts

@@ -1183,7 +1183,7 @@ export function compileScript(
     s.prependLeft(startOffset, `\nlet __temp${any}, __restore${any}\n`)
   }
 
-  const destructureElements = [`expose`]
+  const destructureElements = hasDefineExposeCall ? [`expose`] : []
   if (emitIdentifier) {
     destructureElements.push(
       emitIdentifier === `emit` ? `emit` : `emit: ${emitIdentifier}`
@@ -1256,9 +1256,6 @@ export function compileScript(
     runtimeOptions += genRuntimeEmits(typeDeclaredEmits)
   }
 
-  // <script setup> components are closed by default. If the user did not
-  // explicitly call `defineExpose`, call expose() with no args.
-  const exposeCall = hasDefineExposeCall ? `` : `  expose();\n`
   // wrap setup code with function.
   if (isTS) {
     // for TS, make sure the exported type is still valid type with
@@ -1273,7 +1270,7 @@ export function compileScript(
         `defineComponent`
       )}({${def}${runtimeOptions}\n  ${
         hasAwait ? `async ` : ``
-      }setup(${args}) {\n${exposeCall}`
+      }setup(${args}) {\n`
     )
     s.appendRight(endOffset, `})`)
   } else {
@@ -1283,14 +1280,14 @@ export function compileScript(
       s.prependLeft(
         startOffset,
         `\nexport default /*#__PURE__*/Object.assign(${DEFAULT_VAR}, {${runtimeOptions}\n  ` +
-          `${hasAwait ? `async ` : ``}setup(${args}) {\n${exposeCall}`
+          `${hasAwait ? `async ` : ``}setup(${args}) {\n`
       )
       s.appendRight(endOffset, `})`)
     } else {
       s.prependLeft(
         startOffset,
         `\nexport default {${runtimeOptions}\n  ` +
-          `${hasAwait ? `async ` : ``}setup(${args}) {\n${exposeCall}`
+          `${hasAwait ? `async ` : ``}setup(${args}) {\n`
       )
       s.appendRight(endOffset, `}`)
     }

Diff for: packages/compiler-sfc/test/__snapshots__/compileScript.spec.ts.snap

@@ -102,7 +102,7 @@ const bar = 1
     // should remove defineOptions import and call
     expect(content).not.toMatch('defineProps')
     // should generate correct setup signature
-    expect(content).toMatch(`setup(__props, { expose }) {`)
+    expect(content).toMatch(`setup(__props) {`)
     // should assign user identifier to it
     expect(content).toMatch(`const props = __props`)
     // should include context options in default export
@@ -149,7 +149,7 @@ const myEmit = defineEmits(['foo', 'bar'])
     // should remove defineOptions import and call
     expect(content).not.toMatch('defineEmits')
     // should generate correct setup signature
-    expect(content).toMatch(`setup(__props, { expose, emit: myEmit }) {`)
+    expect(content).toMatch(`setup(__props, { emit: myEmit }) {`)
     // should include context options in default export
     expect(content).toMatch(`export default {
   emits: ['foo', 'bar'],`)
@@ -769,7 +769,7 @@ const emit = defineEmits(['a', 'b'])
       expect(content).toMatch(`export default /*#__PURE__*/_defineComponent({
   props: { foo: String },
   emits: ['a', 'b'],
-  setup(__props, { expose, emit }) {`)
+  setup(__props, { emit }) {`)
     })
 
     test('defineProps w/ type', () => {

Diff for: packages/compiler-sfc/test/compileScript.spec.ts

@@ -13,8 +13,8 @@ export interface Config {
   productionTip: boolean
   performance: boolean
   devtools: boolean
-  errorHandler?: (err: Error, vm: Component, info: string) => void
-  warnHandler?: (msg: string, vm: Component, trace: string) => void
+  errorHandler?: (err: Error, vm: Component | null, info: string) => void
+  warnHandler?: (msg: string, vm: Component | null, trace: string) => void
   ignoredElements: Array<string | RegExp>
   keyCodes: { [key: string]: number | Array<number> }
 

Diff for: src/core/config.ts

@@ -3,7 +3,7 @@ import { noop, isArray, isFunction } from 'shared/util'
 import type { Component } from 'types/component'
 import { currentInstance } from 'v3/currentInstance'
 
-export let warn = noop
+export let warn: (msg: string, vm?: Component | null) => void = noop
 export let tip = noop
 export let generateComponentTrace: (vm: Component) => string // work around flow check
 export let formatComponentName: (vm: Component, includeFile?: false) => string

Diff for: src/core/util/debug.ts

@@ -90,7 +90,7 @@ export type ComponentOptions = {
   comments?: boolean
   inheritAttrs?: boolean
 
-  // Class API
+  // Legacy API
   abstract?: any
 
   // private

Diff for: src/types/options.ts

@@ -12,6 +12,7 @@ export interface SetupContext {
   attrs: Record<string, any>
   slots: Record<string, () => VNode[]>
   emit: (event: string, ...args: any[]) => any
+  expose: (exposed: Record<string, any>) => void
 }
 
 export function initSetup(vm: Component) {
@@ -47,7 +48,7 @@ export function initSetup(vm: Component) {
       if (!setupResult.__sfc) {
         for (const key in setupResult) {
           if (!isReserved(key)) {
-            proxySetupProperty(vm, setupResult, key)
+            proxyWithRefUnwrap(vm, setupResult, key)
           } else if (__DEV__) {
             warn(`Avoid using variables that start with _ or $ in setup().`)
           }
@@ -56,7 +57,7 @@ export function initSetup(vm: Component) {
         // exposed for compiled render fn
         const proxy = (vm._setupProxy = {})
         for (const key in setupResult) {
-          proxySetupProperty(proxy, setupResult, key)
+          proxyWithRefUnwrap(proxy, setupResult, key)
         }
       }
     } else if (__DEV__ && setupResult !== undefined) {
@@ -69,22 +70,23 @@ export function initSetup(vm: Component) {
   }
 }
 
-function proxySetupProperty(
+export function proxyWithRefUnwrap(
   target: any,
-  setupResult: Record<string, any>,
+  source: Record<string, any>,
   key: string
 ) {
-  let raw = setupResult[key]
+  let raw = source[key]
   Object.defineProperty(target, key, {
     enumerable: true,
     configurable: true,
     get: () => (isRef(raw) ? raw.value : raw),
     set: newVal =>
-      isRef(raw) ? (raw.value = newVal) : (raw = setupResult[key] = newVal)
+      isRef(raw) ? (raw.value = newVal) : (raw = source[key] = newVal)
   })
 }
 
-function createSetupContext(vm: Component) {
+function createSetupContext(vm: Component): SetupContext {
+  let exposeCalled = false
   return {
     get attrs() {
       return initAttrsProxy(vm)
@@ -93,8 +95,18 @@ function createSetupContext(vm: Component) {
       return initSlotsProxy(vm)
     },
     emit: bind(vm.$emit, vm) as any,
-    expose() {
-      // TODO
+    expose(exposed?: Record<string, any>) {
+      if (__DEV__) {
+        if (exposeCalled) {
+          warn(`expose() should be called only once per setup().`, vm)
+        }
+        exposeCalled = true
+      }
+      if (exposed) {
+        Object.keys(exposed).forEach(key =>
+          proxyWithRefUnwrap(vm, exposed, key)
+        )
+      }
     }
   }
 }