公共CDN引入Vue3时报错

最近尝试使用vue-cli4创建项目，选择使用vue3.0版本进行开发。之前使用vue2时，为了优化性能使用CDN引入了相关包，因此新的项目也打算采用相同的方式。

然而vue3并没有向2.0版本使用UMD模块化，因此在公共库CDN网站中会发现有多个版本可以选择，例如vue.cjs.js，vue.esm-browser.js，vue.global.js等等。由于自己不懂它们有何区别，在用script标签引入时出现了类似Uncaught ReferenceError: vue is not defined的种种报错。

---

最开始选择引入vue.cjs.js时，浏览器出现了如下的报错：
Uncaught ReferenceError: exports is not defined

这里的cjs是CommonJS的简写，说明因为某种原因浏览器不支持CommonJS规范,或者不能通过script标签引入（具体原因还不清楚）。

接着我看到了vue.esm-browser.js，引入后浏览器又报错了：
Uncaught SyntaxError: Unexpected token 'export'
esm是浏览器使用的模块规范。也没明白为什么引入esm和cjs都会报错。

注意：esm要在script标签中加上 type=“module”

经过尝试，vue.global.js（包含编译器和运行时）和vue.runtime.global.js（运行时版本）都可以使用，并且没有报错。

上面几个版本中都有prod后缀的链接可以选择，估计是和min类似的经过压缩的版本,部署的时候记得换成带prod后缀的。

---

最奇怪的是，在最开始有出现过Uncaught ReferenceError: __VUE_HMR_RUNTIME__ is not defined的报错，到后来又莫名其妙的消失了，真的是一头雾水。