有效的方式
CDN方式引入
<!--引入vue2相应文件-->
<script src="https://unpkg.com/vue@2.6.13/dist/vue.js"></script>
<!-- 引入ElementUI样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入ElementUI组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
下面这样是无效的:
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- 引入ElementUI样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入ElementUI组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
原因:
https://unpkg.com/vue/dist/vue.js-->指向的是https://unpkg.com/vue@3.2.37/dist/vue.js
https://unpkg.com/vue/dist/vue.js-->https://unpkg.com/element-ui@2.15.9/lib/index.js
element-ui是基于Vue2的,所以要指定vue2的版本
Element Plus官网,基于Vue3的element-ui是这样引入的
<!-- 导入样式 -->
<link rel="stylesheet" href="//unpkg.com/element-plus/dist/index.css" />
<!-- 导入 Vue 3 -->
<script src="//unpkg.com/vue@next"></script>
<!-- 导入组件库 -->
<script src="//unpkg.com/element-plus"></script>