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 ...
随机推荐
- 在Linux上查询物理机信息-不用去拆机器了
目录 一.查看系统信息(包含机器型号) 1.1 查看机型和品牌 二.查看CPU 信息 2.1 查看CPU 型号 2.2 查看CPU的物理数量 2.3 查看 CPU核心数量(非逻辑CPU) 2.4 查看 ...
- flask 模型一对多个人理解
在modle中创建两个模型表 class User(db.Model): id = db.Column(db.Integer,primary_key=True,autoincrement=True) ...
- 04-influxdb基本操作
influxdb基本操作 1. 数据库基本操作 # 创建数据库 > create database db01; # 查看数据库 > show databases; name: databa ...
- CouchDB的简单使用
一.安装CouchDB 到官网下载CouchDB,在windows下安装CouchDB较为简单,略过. 安装完后,确认CouchDB在运行,然后在浏览器访问http://127.0.0.1:5984/ ...
- Java中将文件夹复制到另一个文件夹
文件夹的拷贝*** public static void copyDir(String sourcePath, String newPath) { File start = new File(sour ...
- Polly每次重试执行不同的操作
Polly每次重试执行不同的操作 前言 最近在写WG(用的 .net core 3.1 + wpf + abp vnext),程序里大量用到了重试机制选用的是Polly组件(只知道这个...). ...
- 公钥体系(PKI)等密码学技术基础
公钥体系(PKI)等密码学技术基础 公钥体系(Public Key Infrastructure, PKI)的一些概念 对称密码算法, 典型算法:DES, AES 加解密方共用一个密钥 加/解密速度快 ...
- 使用JDBC工具类模拟登陆验证-Java(新手)
模拟登陆验证: package JdbcDome; import java.sql.Connection; import java.sql.PreparedStatement; import java ...
- ERP系统功能及部署方式
ERP是对企业经营过程中的一些事项进行系统化管理的一种软件,所以ERP软件包含企业经营过程中需要用到的多种功能管理模块,并且ERP软件有两种部署方式.下面一起来了解一下相关的知识吧! ERP系统的功能 ...
- ChaosTool,iOS添加垃圾代码工具,代码混淆工具,代码生成器,史上最好用的垃圾代码添加工具,自己开发的小工具
最近在H5游戏项目中需要添加垃圾代码作混淆,提高过审机率.手动添加太费时费力,在网上并没有找到合适的比较好的工具,就自己动手写了一个垃圾代码添加工具,命名为ChaosTool. 扣扣交流群:81171 ...