vue项目引入element ui、iview和echarts

芝士焗红薯

已于 2022-05-10 15:35:33 修改

阅读量620

点赞数

分类专栏： # vue 前端文章标签： vue.js echarts ui elementui

于 2022-05-09 18:04:39 首次发布

本文链接：https://blog.csdn.net/weixin_44320032/article/details/124671611

版权

53 篇文章 3 订阅

订阅专栏

44 篇文章 2 订阅

订阅专栏

本文详细介绍了如何在Vue项目中分别引入ElementUI、iView和ECharts。首先通过npm安装相应库，然后在main.js文件中导入库文件并全局注册。对于ECharts，除了项目级引入，还需在使用页面导入。完成这些步骤后，即可在Vue组件中使用这些库的组件和功能。

摘要由CSDN通过智能技术生成

脑子不好，每次引入都要重新搜一遍，今天把几个自己整理一下。全部引入，没搞按需引入。

1.vue项目引入elementui

控制台输入npm install element-ui -s

main.js文件中输入

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

Vue.use(ElementUI)

2.vue项目中引入iview

控制台输入npm install iview -s

import iView from 'iview' // 引入ivew库
import 'iview/dist/styles/iview.css' // 使用CSS

Vue.use(iView)

3.vue项目中引入echarts

控制台输入npm install echarts -s

import * as echarts from 'echarts' // 导入echarts

Vue.prototype.$echarts = echarts // 并设置对应的属性

4.main.js文件代码截图

5.echarts在引入之后，需要使用echarts的页面，还需要import一下

<script>
import * as echarts from 'echarts'
</script>

6.引入之后就可以使用他们的组件了。

关注