fix(compiler-sfc): generate more treeshaking friendly code (#9507)

close #9500

packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineModel.spec.ts.snap

@@ -27,7 +27,7 @@ exports[`defineModel() > w/ array props 1`] = `
 "import { useModel as _useModel, mergeModels as _mergeModels } from 'vue'
 
 export default {
-  props: _mergeModels(['foo', 'bar'], {
+  props: /*#__PURE__*/_mergeModels(['foo', 'bar'], {
     \\"count\\": {},
   }),
   emits: [\\"update:count\\"],
@@ -47,10 +47,10 @@ exports[`defineModel() > w/ defineProps and defineEmits 1`] = `
 "import { useModel as _useModel, mergeModels as _mergeModels } from 'vue'
 
 export default {
-  props: _mergeModels({ foo: String }, {
+  props: /*#__PURE__*/_mergeModels({ foo: String }, {
     \\"modelValue\\": { default: 0 },
   }),
-  emits: _mergeModels(['change'], [\\"update:modelValue\\"]),
+  emits: /*#__PURE__*/_mergeModels(['change'], [\\"update:modelValue\\"]),
   setup(__props, { expose: __expose }) {
   __expose();
 

packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineProps.spec.ts.snap

@@ -332,7 +332,7 @@ exports[`defineProps > withDefaults (dynamic) 1`] = `
 import { defaults } from './foo'
     
 export default /*#__PURE__*/_defineComponent({
-  props: _mergeDefaults({
+  props: /*#__PURE__*/_mergeDefaults({
     foo: { type: String, required: false },
     bar: { type: Number, required: false },
     baz: { type: Boolean, required: true }
@@ -353,7 +353,7 @@ exports[`defineProps > withDefaults (dynamic) w/ production mode 1`] = `
 import { defaults } from './foo'
     
 export default /*#__PURE__*/_defineComponent({
-  props: _mergeDefaults({
+  props: /*#__PURE__*/_mergeDefaults({
     foo: { type: Function },
     bar: { type: Boolean },
     baz: { type: [Boolean, Function] },
@@ -375,7 +375,7 @@ exports[`defineProps > withDefaults (reference) 1`] = `
 import { defaults } from './foo'
     
 export default /*#__PURE__*/_defineComponent({
-  props: _mergeDefaults({
+  props: /*#__PURE__*/_mergeDefaults({
     foo: { type: String, required: false },
     bar: { type: Number, required: false },
     baz: { type: Boolean, required: true }
@@ -462,7 +462,7 @@ exports[`defineProps > withDefaults w/ dynamic object method 1`] = `
 "import { mergeDefaults as _mergeDefaults, defineComponent as _defineComponent } from 'vue'
 
 export default /*#__PURE__*/_defineComponent({
-  props: _mergeDefaults({
+  props: /*#__PURE__*/_mergeDefaults({
     foo: { type: Function, required: false }
   }, {
       ['fo' + 'o']() { return 'foo' }

packages/compiler-sfc/__tests__/compileScript/__snapshots__/definePropsDestructure.spec.ts.snap

@@ -62,7 +62,7 @@ exports[`sfc reactive props destructure > default values w/ array runtime declar
 "import { mergeDefaults as _mergeDefaults } from 'vue'
 
 export default {
-  props: _mergeDefaults(['foo', 'bar', 'baz'], {
+  props: /*#__PURE__*/_mergeDefaults(['foo', 'bar', 'baz'], {
   foo: 1,
   bar: () => ({}),
   func: () => {}, __skip_func: true
@@ -81,7 +81,7 @@ exports[`sfc reactive props destructure > default values w/ object runtime decla
 "import { mergeDefaults as _mergeDefaults } from 'vue'
 
 export default {
-  props: _mergeDefaults({ foo: Number, bar: Object, func: Function, ext: null }, {
+  props: /*#__PURE__*/_mergeDefaults({ foo: Number, bar: Object, func: Function, ext: null }, {
   foo: 1,
   bar: () => ({}),
   func: () => {}, __skip_func: true,
@@ -101,7 +101,7 @@ exports[`sfc reactive props destructure > default values w/ runtime declaration
 "import { mergeDefaults as _mergeDefaults } from 'vue'
 
 export default {
-  props: _mergeDefaults(['foo', 'foo:bar'], {
+  props: /*#__PURE__*/_mergeDefaults(['foo', 'foo:bar'], {
   foo: 1,
   \\"foo:bar\\": 'foo-bar'
 }),

packages/compiler-sfc/__tests__/compileScript/defineModel.spec.ts

@@ -48,7 +48,7 @@ describe('defineModel()', () => {
       { defineModel: true }
     )
     assertCode(content)
-    expect(content).toMatch(`props: _mergeModels({ foo: String }`)
+    expect(content).toMatch(`props: /*#__PURE__*/_mergeModels({ foo: String }`)
     expect(content).toMatch(`"modelValue": { default: 0 }`)
     expect(content).toMatch(`const count = _useModel(__props, "modelValue")`)
     expect(content).not.toMatch('defineModel')
@@ -70,7 +70,7 @@ describe('defineModel()', () => {
       { defineModel: true }
     )
     assertCode(content)
-    expect(content).toMatch(`props: _mergeModels(['foo', 'bar'], {
+    expect(content).toMatch(`props: /*#__PURE__*/_mergeModels(['foo', 'bar'], {
     "count": {},
   })`)
     expect(content).toMatch(`const count = _useModel(__props, "count")`)

packages/compiler-sfc/__tests__/compileScript/definePropsDestructure.spec.ts

@@ -78,7 +78,8 @@ describe('sfc reactive props destructure', () => {
     // literals can be used as-is, non-literals are always returned from a
     // function
     // functions need to be marked with a skip marker
-    expect(content).toMatch(`props: _mergeDefaults(['foo', 'bar', 'baz'], {
+    expect(content)
+      .toMatch(`props: /*#__PURE__*/_mergeDefaults(['foo', 'bar', 'baz'], {
   foo: 1,
   bar: () => ({}),
   func: () => {}, __skip_func: true
@@ -98,7 +99,7 @@ describe('sfc reactive props destructure', () => {
     // safely infer whether runtime type is Function (e.g. if the runtime decl
     // is imported, or spreads another object)
     expect(content)
-      .toMatch(`props: _mergeDefaults({ foo: Number, bar: Object, func: Function, ext: null }, {
+      .toMatch(`props: /*#__PURE__*/_mergeDefaults({ foo: Number, bar: Object, func: Function, ext: null }, {
   foo: 1,
   bar: () => ({}),
   func: () => {}, __skip_func: true,
@@ -122,7 +123,7 @@ describe('sfc reactive props destructure', () => {
     })
 
     expect(content).toMatch(`
-  props: _mergeDefaults(['foo', 'foo:bar'], {
+  props: /*#__PURE__*/_mergeDefaults(['foo', 'foo:bar'], {
   foo: 1,
   "foo:bar": 'foo-bar'
 }),`)

packages/compiler-sfc/src/script/defineEmits.ts

@@ -58,7 +58,9 @@ export function genRuntimeEmits(ctx: ScriptCompileContext): string | undefined {
       .map(n => JSON.stringify(`update:${n}`))
       .join(', ')}]`
     emitsDecl = emitsDecl
-      ? `${ctx.helper('mergeModels')}(${emitsDecl}, ${modelEmitsDecl})`
+      ? `/*#__PURE__*/${ctx.helper(
+          'mergeModels'
+        )}(${emitsDecl}, ${modelEmitsDecl})`
       : modelEmitsDecl
   }
   return emitsDecl

packages/compiler-sfc/src/script/defineProps.ts

@@ -144,7 +144,7 @@ export function genRuntimeProps(ctx: ScriptCompileContext): string | undefined {
           )
       }
       if (defaults.length) {
-        propsDecls = `${ctx.helper(
+        propsDecls = `/*#__PURE__*/${ctx.helper(
           `mergeDefaults`
         )}(${propsDecls}, {\n  ${defaults.join(',\n  ')}\n})`
       }
@@ -156,7 +156,9 @@ export function genRuntimeProps(ctx: ScriptCompileContext): string | undefined {
   const modelsDecls = genModelProps(ctx)
 
   if (propsDecls && modelsDecls) {
-    return `${ctx.helper('mergeModels')}(${propsDecls}, ${modelsDecls})`
+    return `/*#__PURE__*/${ctx.helper(
+      'mergeModels'
+    )}(${propsDecls}, ${modelsDecls})`
   } else {
     return modelsDecls || propsDecls
   }
@@ -184,9 +186,9 @@ function genRuntimePropsFromTypes(ctx: ScriptCompileContext) {
     ${propStrings.join(',\n    ')}\n  }`
 
   if (ctx.propsRuntimeDefaults && !hasStaticDefaults) {
-    propsDecls = `${ctx.helper('mergeDefaults')}(${propsDecls}, ${ctx.getString(
-      ctx.propsRuntimeDefaults
-    )})`
+    propsDecls = `/*#__PURE__*/${ctx.helper(
+      'mergeDefaults'
+    )}(${propsDecls}, ${ctx.getString(ctx.propsRuntimeDefaults)})`
   }
 
   return propsDecls