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 + el-form 实现的多层循环表单验证
Nov 25 Vue.js
在vue中使用inheritAttrs实现组件的扩展性介绍
Dec 07 Vue.js
Vue 组件注册全解析
Dec 17 Vue.js
vue实现树状表格效果
Dec 29 Vue.js
如何在vue中使用HTML 5 拖放API
Jan 14 Vue.js
vue实现可移动的悬浮按钮
Mar 04 Vue.js
如何理解Vue简单状态管理之store模式
May 15 Vue.js
vue使用节流函数的踩坑实例指南
May 20 Vue.js
Vue鼠标滚轮滚动切换路由效果的实现方法
Aug 04 Vue.js
Vue elementUI表单嵌套表格并对每行进行校验详解
Feb 18 Vue.js
Vue的生命周期一起来看看
Feb 24 Vue.js
分享一个vue实现的记事本功能案例
Apr 11 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
php 文件上传系统手记
2009/10/26 PHP
PHP 字符串正则替换函数preg_replace使用说明
2011/07/15 PHP
php面向对象编程self和static的区别
2016/05/08 PHP
php/JS实现的生成随机密码(验证码)功能示例
2019/06/06 PHP
PHP实现的文件浏览器功能简单示例
2019/09/12 PHP
js停止输出代码
2008/07/20 Javascript
网站页面自动跳转实现方法PHP、JSP(下)
2010/08/01 Javascript
jquery退出each循环的写法
2014/02/26 Javascript
jQuery实现文字自动横移
2017/01/08 Javascript
JS控制鼠标拒绝点击某一按钮的实例
2017/12/29 Javascript
微信小程序wx.uploadfile 本地文件转base64的实现代码
2018/06/28 Javascript
JavaScript数据结构与算法之二叉树实现查找最小值、最大值、给定值算法示例
2019/03/01 Javascript
微信小程序设置滚动条过程详解
2019/07/25 Javascript
JS document form表单元素操作完整示例
2020/01/13 Javascript
js实现百度登录窗口拖拽效果
2020/03/19 Javascript
react+antd 递归实现树状目录操作
2020/11/02 Javascript
Python 字符串操作方法大全
2014/03/11 Python
Python统计列表中的重复项出现的次数的方法
2014/08/18 Python
Python基于DES算法加密解密实例
2015/06/03 Python
python numpy和list查询其中某个数的个数及定位方法
2018/06/27 Python
python操作kafka实践的示例代码
2019/06/19 Python
Python3批量移动指定文件到指定文件夹方法示例
2019/09/02 Python
python 实现屏幕录制示例
2019/12/23 Python
Python和Sublime整合过程图示
2019/12/25 Python
Python Handler处理器和自定义Opener原理详解
2020/03/05 Python
什么是python的必选参数
2020/06/21 Python
北美最大的零售退货翻新商:VIP Outlet
2019/11/21 全球购物
Erwin Müller穆勒家居瑞士官网:您整个家庭的邮购公司
2019/12/28 全球购物
销售高级职员求职信
2013/10/29 职场文书
《每逢佳节倍思亲》教后反思
2014/04/19 职场文书
学校爱心捐款倡议书
2014/05/13 职场文书
领导干部失职检讨书
2015/05/05 职场文书
离婚撤诉申请书范本
2015/05/18 职场文书
2015年秋学期教研工作总结
2015/10/14 职场文书
ROS系统将python包编译为可执行文件的简单步骤
2021/07/25 Python
mysql中varchar类型的日期进行比较、排序等操作的实现
2021/11/17 MySQL