refactor: replace const enum with enum

[yangmingshan]

Fixes #1228

As we discussed in #9243

Turns out we don't need a rollup plugin, global replacements is enough.

[github-actions]

Size Report

Bundles

File	Size	Gzip	Brotli
runtime-dom.global.prod.js	88.4 kB (+2.58 kB)	33.6 kB (+1 kB)	30.3 kB (+796 B)
vue.global.prod.js	134 kB (+2.58 kB)	50.4 kB (+1.02 kB)	45.1 kB (+763 B)

Usages

Name	Size	Gzip	Brotli
createApp	47.9 kB	18.8 kB	17.2 kB
createSSRApp	50.6 kB	19.9 kB	18.2 kB
defineCustomElement	50.3 kB	19.6 kB	17.9 kB
overall	61.2 kB	23.7 kB	21.6 kB

[yangmingshan]

How can I rerun e2e-test? It passed on my machine 😬.

[xiaoxiangmoe]

@yangmingshan

The js generated by your PR will look like this

var ElementTypes = /* @__PURE__ */ ((ElementTypes2) => {
  ElementTypes2[ElementTypes2["ELEMENT"] = 0] = "ELEMENT";
  ElementTypes2[ElementTypes2["COMPONENT"] = 1] = "COMPONENT";
  ElementTypes2[ElementTypes2["SLOT"] = 2] = "SLOT";
  ElementTypes2[ElementTypes2["TEMPLATE"] = 3] = "TEMPLATE";
  return ElementTypes2;
})(ElementTypes || {});

see https://www.npmjs.com/package/babel-plugin-const-enum?activeTab=readme#user-content-transform-constobject

transform: constObject
Transforms into a const object literal. Can be further compressed using Uglify/Terser to inline enum access. See babel#8741.

If we change it to

const ElementTypes = {
  ELEMENT: 0,
  COMPONENT: 1,
  SLOT: 2,
  TEMPLATE: 3,
  0: 'ELEMENT',
  1: 'COMPONENT',
  2: 'SLOT',
  3: 'TEMPLATE',
};

If will help library users to use it like const enum with tree shaking help.

Especially for some larger enums, such as ErrorCodes, which have more than 50 enum members, the size problem will be very serious.

Can you modify your code to generate constObject style enum？

[sxzz]

Could you please add eslint rules as well?
See https://github.com/vuejs/core/pull/9261/files#diff-e1ce717e1179a0db14e90ec5374768a206651ca807db58352991eb7895ed7c9c

[xiaoxiangmoe]

Also, in your PR, there exist some any

But in my PR, I add types for them

Can you add types for your codes?

[yangmingshan]

@xiaoxiangmoe Hi, are you interested in collaborating? Let's merge our PRs

[yangmingshan]

It seems like current there is no easy way to transform enum to a simple object (@xiaoxiangmoe used a custom rollup plugin).

Let's see if esbuild can help. evanw/esbuild#3402

[yangmingshan]

esbuild refused, which was not surprising.

If Vue want transform enum to simple object, then @xiaoxiangmoe's PR is better. Feel free to close this one.

But since there is no simple way to do this, is it worth it?
Are there any unknown downsides? E.g. type and runtime mismatch 🤔️.

[xiaoxiangmoe]

@yangmingshan No, there will have no type and runtime mismatch.

See my latest update

[yangmingshan]

@xiaoxiangmoe The benefits of your approach are:

1. More friendly for minifier (possible inline output).
2. Slightly smaller size.

Right?

[xiaoxiangmoe]

Yes.

[yangmingshan]

Better is better, complexity is no excuse for libraries. I prefer @xiaoxiangmoe's PR, I'm closing this one.