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 ...
随机推荐
- 【10】openlayers 视图view
创建地图: //View对象代表地图的简单2D视图 //创建view let view = new ol.View({ center:[109,34],//视图的初始中心 maxZoom:18,//最 ...
- python的基本数据类型简介
python的基本数据类型有:数字-numbers.字符串-str.列表-list.元组-tuple.字典-dict.布尔-bool.集合-set 下面来个概览先大概了解一下,后面博文中咱再细说- 1 ...
- js实现字符串逆向输出的4种方式
一.第一种方式(利用charAt()这个函数实现) 代码如下: var str="你好世界!!!!"; var str1="";//这里创建一个空字符串用来拼接 ...
- 记录一个引用文件所有js文件的方法
在项目api声明的时候,避免每次添加新的js都要对应去处理 首先我在项目api文件下新建一个files的文件夹,然后再api文件夹下的index.js这样写: var api = {}; const ...
- 【工具】Intel HLS工具
目前新版本的Quartus 软件 都自带有 HLS 工具,比如 18.1版本安装以后,HLS相关文件夹如下: HLS工具 也可以单独下载: https://www.intel.com/content ...
- IPv6 时代如何防御 DDoS 攻击?
在互联网世界,每台联网的设备都被分配了一个用于标识和位置定义的 IP 地址.20 世纪 90 年代以来互联网的快速发展,联网设备所需的地址远远多于可用 IPv4 地址的数量,导致了 IPv4 地址耗尽 ...
- 聊一聊React中虚拟DOM
1. 什么是虚拟 DOM 在 React 中实际上是 render 函数中return 的内容会生成 DOM,return 中的内容由两部分组成,一部分是 JSX ,另一部分就是 state 中的数据 ...
- PDIUSBD12管脚简述
PDIUSBD12管脚简述 PDIUSBD12管脚及简述 PDIUSBD12读写时序图 CS_N是片选信号,当片选信号位低电平时,下面的操作才有效.由于板子上将CS_N接地,所以它一 ...
- 手把手构建LSTM的向前传播(Building a LSTM step by step)
本篇是在之前两篇基础上接着写的: 吴恩达deepLearning.ai循环神经网络RNN学习笔记(理论篇) 从头构建循环神经网络RNN的向前传播(rnn in pure python) 也可以不看 ...
- 数据库事务练习-Java(新手)
数据库事务: 一个数据库事务通常包含了一个序列的对数据库的读/写操作. 为数据库操作序列提供了一个从失败中恢复到正常状态的方法,同时提供了数据库即使在异常状态下仍能保持一致性的方法. p ...