vue cdn引入第三方依赖

第一步

index.html中：

//最好放到head里面
<head>
<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"><!-- 引入js -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.7.6/vue.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/vue-router/3.0.2/vue-router.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/vuex/3.0.1/vuex.min.js"></script>
//使用vueX的方法
//定义后页面不需要 import { mapState } from 'vuex'，直接使用 mapState
<script>var mapState=Vuex.mapStatevar mapGetters=Vuex.mapGetters</script>
</head>

第二步：

webpack.base.conf.js 或者 vue.config.js

webpack.base.conf.js:
module.exports={externals:{'vue': 'Vue','vue-router': 'VueRouter','vuex': 'Vuex','element-ui': 'ELEMENT',},
}vue.config.js:module.exports = {configureWebpack:{externals: {//包名 ： 全局变量'vue': 'Vue','vue-router': 'VueRouter','vuex': 'Vuex','element-ui': 'ELEMENT',}}
};

第三步：

// import Vue from "vue";
// import { mapState,mapGetters } from 'vuex'
// import vueRouter from 'vue-router'
// import Vuex from 'vuex'
都需要注释掉但是：
Vue.use(Vuex)
Vue.use(VueRouter)
等还是需要使用如果使用了 ElementUI，Vue.use(ElementUI) 也不需要了，不然还是会打包进入vendor.js

快捷查找依赖的cdn地址：cdn地址

vue cdn引入第三方依赖相关推荐

vue项目引入第三方地图插件并且随机显示坐标点（经纬度），点击坐标点弹出窗口，点击详情文字链接到其他模块
再vue中引入第三方插件-- https://www.npmjs.com/package/vue-baidu-map 一个百度地图的vue封装上述中的内容在第三方插件的文档介绍中都有. 在具体特性 ...
vue-cli3项目通过vue如何引入第三方js包完成登陆功能
注意:本次登陆,前后端分离:前端通过引入第三方的js包,调用js包里的初始化方法和提交方法完成登陆以及退出: 流程1.引入第三方包 1.1在index.html文件下引入流程2.完成初始化在组件的 ...
vue Elementui 引入第三方icon(阿里矢量库)
在做项目的过程中,发现elementui图标比较少,根据ui好多图标都没有,被迫只能通过引入第三方图标啦,自己通过参考其他教程,整理一下过程呀首先呢需要去阿里矢量图库注册账号呀接下来,需要新建项 ...
layui引入第三方依赖
layui引入第三方js插件准备编写第一个Hello World 配置第三方js路径用layui包裹一个js插件在页面调用在layui中引入moment第三方插件配置moment momen ...
Vue如何引入第三方js
最近遇到的问题是如何在vue中引入mui.js,通过import引入就报这个错一看就知道mui是传统模式,没有es6的export写法,所以import引用不到,给mui加上export defau ...
Vue cli 引入第三方JS和CSS的常用方法
如果要引入第三方JS或者css 最好是把文件放在statis文件夹下,此处是静态文件存放的位置第一种方法: 直接在index.html中引入 js <script type="te ...
vue中引入第三方js
vue中常遇到第三方js,简单粗暴的可以直接在html页面中引入cdn. 或者在 webpack.base.conf.js 中进行配置. module.exports = {entry: {track ...
vue element-ui引入第三方图标在线版
参考链接:Vue Element-UI使用icon图标(第三方)–在线版 - 简书 vue项目版本为vue3 打开iconfont-阿里巴巴矢量图标库,注册登录之后回到首页在首页顶部菜单图标管理& ...
vue element-ui引入第三方图标
参考链接Vue Element使用icon图标(第三方) - 简书项目vue版本为vue3,按照上文重新整理的笔记打开iconfont-阿里巴巴矢量图标库,注册登录之后回到首页在首页顶部菜单图 ...

vue cdn引入第三方依赖

vue cdn引入第三方依赖相关推荐

最新文章

热门文章