vue按需引入/全局引入echarts
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的更多相关文章
- vue项目中设置全局引入scss,使每个组件都可以使用变量
在Vue项目中使用scss,如果写了一套完整的有变量的scss文件.那么就需要全局引入,这样在每个组件中使用. 可以在mian.js全局引入,下面是使用方法. 1: 安装node-sass.sass- ...
- vue cli web pack 全局引入jquery
之前 装过,装 npm i —save jquery 然后直接执行了第二步 往后 1,首先在 package.json 里加入, 然后 npm install 2, 在webpack.base.c ...
- vue安装scss,并且全局引入
在写vue的css样式时,觉得需要css预处理器让自己的css更加简洁.适应性更强.可读性更佳,更易于代码的维护,于是在vue-cli脚手架采用scss.写过的人都知道,每写一个.vue文件都要在st ...
- 【vue】——CDN或全局引入CSS、JS。
在入口文件index.html中添加 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
- vant库在vue全局引入toast组件
第一步: 在config中引入 // 全局引入vant的提示框 import { Toast } from "vant"; Vue.use(Toast); 第二步: 在组要的.vu ...
- vue按需引入echarts
下载安装echarts包:npm install echarts -D 一.全局引入 main.js中配置 import echarts from 'echarts' //引入echarts Vue. ...
- vue按需引入element或mint
vue按需引入element或mint需要添加 babel-preset-es2015 和babel-plugin-component
- 如何在 vue 2.0+ 中引入全局的stylus文件,且能正常
由于stylus在引用时,不能像一般的css文件直接在main.js中引用,就算引用了也会只能使用转换后的css,不能使用里面的函数,方法等,原因可能是:在这里引入会被直接编译成css,不能在别的模板 ...
- vue,一路走来(17)--vue使用scss,并且全局引入公共scss样式
最近朋友问如何在vue项目中使用scss样式,想起之前项目是直接在main.js直接import css文件的,然而main.js不可以直接import scss文件. import './asset ...
随机推荐
- XCTF---easyjava的WriteUp
一.题目来源 题目来源:XCTF题库安卓区easyjava 题目下载链接:下载地址 二.解题过程 1.将该apk安装进夜神模拟器中,发现有一个输入框和一个按钮,随便输入信息,点 ...
- JavaScript入门进阶(二)
JavaScript进阶入门(二) 转换为数字 使用parseInt() parseInt函数会先查看位置0处的字符,如果该位置不是有效数字,则将返回NaN,如果0处的字符是数字,则将查看位置1处的字 ...
- 鼠年开元用逐浪CMS v8.13版-NoSQL安装更轻便
作为国内领先的Zoomla!逐浪CMS,一直以来深受人道的除了其功能强大.性能稳定外,易用性也是其突出的现. 自Zoomla!逐浪CMS 8.x开始,官方在其程序包中,集成了一键安装进程,从而大大提升 ...
- scrapy全栈抓xpc练习
# spider文件 # -*- coding: utf-8 -*- import scrapy import re from scrapy import Request import json im ...
- Js中的window.parent ,window.top,window.self 了解
在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法 ...
- 【Linux】linux系统管理---好用的一些开源工具
目录 linux系统管理---好用的一些开源工具 htop dstat Glances iftop nethogs iotop linux系统管理---好用的一些开源工具 htop htop是一款运行 ...
- 2. Plugin execution not covered by lifecycle configuration
问题: 找到当前项目的工作空间下的.metadata\.plugins\org.eclipse.m2e.core路径, 然后添加lifecycle-mapping-metadata.xml文件,内容如 ...
- RabbitMQ 在Ubuntu18.04上的安装
1.安装erlang由于rabbitMq需要erlang语言的支持,在安装rabbitMq之前需要安装erlang sudo apt-get install erlang2.安装Rabbitmq更新源 ...
- Longest subarray of target sum
2018-07-08 13:24:31 一.525. Contiguous Array 问题描述: 问题求解: 我们都知道对于subarray的问题,暴力求解的时间复杂度为O(n ^ 2),问题规模已 ...
- [贪心,dp] Educational Codeforces Round 71 (Rated for Div. 2) C. Gas Pipeline (1207C)
题目:http://codeforces.com/contest/1207/problem/C C. Gas Pipeline time limit per test 2 seconds memo ...