Vue项目如何引入bootstrap、elementUI、echarts


Posted in Vue.js onNovember 26, 2020

引入bootstrap

安装依赖包

cnpm install bootstrap --save-dev
cnpm install jquery --save-dev
cnpm install popper.js --save-dev

全局引入

在项目中根目录下的main.js中添加如下代码:

import 'bootstrap'
import $ from 'jquery'

在vue文件中引用

<script>
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'
</script>

引入elementUI

安装 elementUI

打开终端,输入以下内容

npm i element-ui -S

全局引入

在项目中根目录下的main.js中添加如下代码:

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI)

引入echarts

安装echarts

npm install echarts -S

2.全局引入main.js

// 引入echarts
import echarts from 'echarts'
Vue.prototype.$echarts = echarts

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Vue.js 相关文章推荐
vue实现下载文件流完整前后端代码
Nov 17 Vue.js
Vue Elenent实现表格相同数据列合并
Nov 30 Vue.js
vue中如何自定义右键菜单详解
Dec 08 Vue.js
SpringBoot+Vue 前后端合并部署的配置方法
Dec 30 Vue.js
vue-quill-editor插入图片路径太长问题解决方法
Jan 08 Vue.js
antdesign-vue结合sortablejs实现两个table相互拖拽排序功能
Jan 08 Vue.js
详解为什么Vue中的v-if和v-for不建议一起用
Jan 13 Vue.js
vue3.0 项目搭建和使用流程
Mar 04 Vue.js
Vue CLI中模式与环境变量的深入详解
May 30 Vue.js
Vue鼠标滚轮滚动切换路由效果的实现方法
Aug 04 Vue.js
vue使用Google Recaptcha验证的实现示例
Aug 23 Vue.js
vue本地构建热更新卡顿的问题“75 advanced module optimization”完美解决方案
Aug 05 Vue.js
vue实现广告栏上下滚动效果
Nov 26 #Vue.js
Vue组件生命周期运行原理解析
Nov 25 #Vue.js
vue element-ul实现展开和收起功能的实例代码
Nov 25 #Vue.js
在Vue中使用mockjs代码实例
Nov 25 #Vue.js
Vue3配置axios跨域实现过程解析
Nov 25 #Vue.js
Vue使用Element实现增删改查+打包的步骤
Nov 25 #Vue.js
vue + el-form 实现的多层循环表单验证
Nov 25 #Vue.js
You might like
CodeIgniter框架过滤HTML危险代码
2014/06/12 PHP
destoon各类调用汇总
2014/06/20 PHP
php简单实现无限分类树形列表的方法
2015/03/27 PHP
php实现图片上传并利用ImageMagick生成缩略图
2016/03/14 PHP
Laravel实现构造函数自动依赖注入的方法
2016/03/16 PHP
由php中字符offset特征造成的绕过漏洞详解
2017/07/07 PHP
用正则获取指定路径文件的名称
2007/02/27 Javascript
获取网站跟路径的javascript代码(站点及虚拟目录)
2009/10/20 Javascript
jQuery的:parent选择器定义和用法
2014/07/01 Javascript
轻松创建nodejs服务器(7):阻塞操作的实现
2014/12/18 NodeJs
Javascript中的匿名函数与封装介绍
2015/03/15 Javascript
js 求时间差的实现代码
2016/04/26 Javascript
ionic js 复选框 与普通的 HTML 复选框到底有没区别
2016/06/06 Javascript
bootstrap modal弹出框的垂直居中
2016/12/14 Javascript
微信小程序 利用css实现遮罩效果实例详解
2017/01/21 Javascript
详解Vue-cli代理解决跨域问题
2017/09/27 Javascript
JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例
2018/02/08 Javascript
Vue实现一个图片懒加载插件
2019/03/11 Javascript
javascript头像上传代码实例
2019/09/28 Javascript
python下setuptools的安装详解及No module named setuptools的解决方法
2017/07/06 Python
Python聊天室程序(基础版)
2018/04/01 Python
python操作kafka实践的示例代码
2019/06/19 Python
用python打印菱形的实操方法和代码
2019/06/25 Python
Python2和3字符编码的区别知识点整理
2019/08/08 Python
iHerb香港:维生素、补充剂和天然保健品
2017/08/01 全球购物
意大利文具和办公产品在线商店:Y-Office
2020/02/27 全球购物
大专生工程监理求职信
2013/10/04 职场文书
应聘医药销售自荐书范文
2014/02/08 职场文书
房务中心文员岗位职责
2014/04/16 职场文书
酒店节能减排方案
2014/05/26 职场文书
2015年预备党员自我评价
2015/03/04 职场文书
计算机专业自荐信范文
2015/03/26 职场文书
话题作文之学会尊重
2019/12/16 职场文书
Python函数中apply、map、applymap的区别
2021/11/27 Python
中国古风插画师排行榜:夏达第一,第三是阴阳师姑获鸟皮肤创作者
2022/03/18 国漫
在 Python 中利用 Pool 进行多线程
2022/04/24 Python