码迷,mamicode.com
首页 > 其他好文 > 详细

vue按需引入/全局引入echarts

时间:2020-03-26 12:19:19      阅读:159      评论:0      收藏:0      [点我收藏+]

标签:文件引入   prototype   注意   配置   mon   efault   port   comm   路径   

npm install echarts -S

  

1.按需引入

新建echarts.js公共引入

// 文件路径 @/lib/echarts.js 自行配置
 
 // 加载echarts,注意引入文件的路径
 import echarts from ‘echarts/lib/echarts‘
 
 // 再引入你需要使用的图表类型,标题,提示信息等
 import ‘echarts/lib/chart/bar‘
 import ‘echarts/lib/component/legend‘
 import ‘echarts/lib/component/title‘
 import ‘echarts/lib/component/tooltip‘
 
 export default echarts

  在echart.vue文件引入echarts.js文件

<template>
  <div class="about">
    <!-- <h2>This is an aboutEchart page</h2> -->
    <div id="myChart" ref="myChart"></div>     
  </div>
</template>
<script>
import echarts from ‘@/common/echarts‘

2.全局引入echarts

 

在main.js中

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

 

vue按需引入/全局引入echarts

标签:文件引入   prototype   注意   配置   mon   efault   port   comm   路径   

原文地址:https://www.cnblogs.com/xzybk/p/12573279.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!