CDN官网：可以查看所有插件https://www.bootcdn.cn/
cdn引入echarts
1、在public - index.html中
<!-- 引入 echarts的 JS 文件 -->
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/4.8.0/echarts.common.js"></script>
2、在vue.config.js中 externals中加 echarts: 'echarts'
const path = require('path')
function resolve(dir) {
return path.join(__dirname, dir)
}
module.exports = {
chainWebpack: config => {
config.resolve.alias
.set('components', resolve('src/components'))
.set('views', resolve('src/views'))
config.externals({
vant: 'vant',
echarts: 'echarts'
})
},
lintOnSave: true // 打开 eslint 检查
}
3、在要使用的vue文件中
import echarts from 'echarts'
cdn引入vant 、element等
引入vant
1、index.html中
这里要注意2点；1、vant低版本的没有van-calender 2、必须先引入vue再引入vant
<!-- 引入vant样式文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.9/lib/index.css">
<!-- 引入 Vue 和 Vant 的 JS 文件 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vant@2.9/lib/vant.min.js"></script>
<!-- 引入element样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入element组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
2、在vue.config.js中 externals中加 vant: 'vant'，同上
3、在main.js中引入vant
import vant from 'vant'
Vue.use(vant)
