1、html 中引入 echarts

        html中添加script标签如下:
        <script src="//cdn.bootcss.com/echarts/4.2.1/echarts.simple.min.js"></script>
2、在 webpack 中配置使用 echarts CDN
 
   在vue.config.js中配置如下:
   module.exports = {
    configureWebpack: {
      externals: {
        'echarts': 'echarts' // 配置使用CDN
      }
    }
   }
  externals中的key是用于import,value表示的在全局中访问到该对象,就是window.echarts
3、在vue文件中使用
   在vue中使用echarts的时候无需 import echarts,可直接使用

vue-cli3项目中使用CDN的更多相关文章

  1. vue cli3项目中使用qrcodejs2生成二维码

    组件的形式创建 1.下载依赖 npm install qrcodejs2 2.创建一个.vue的组件放置代码(我创建的是qrcodejs2.vue) //template中的代码 <templa ...

  2. 让webstorm 识别vue cli3项目中的@路径别名

    在setting -> languages&frameworks -> webpack里选择配置文件路径为 node_modules/@vue/cli-service/webpac ...

  3. Vue+Typescript项目中使用echarts

    方案一:推荐 在typescript+Vue的项目中引用echarts,为了加强引用,引入echarts和@types/echarts两个包,一个是工程依赖,一个是声明依赖. npm install ...

  4. 在基于ABP框架的前端项目Vue&Element项目中采用电子签章处理文件和打印处理

    在一些内部OA或者流转的文件,或者给一些客户的报价文件.合同,或者一些医院出示的给保险机构的病历资料等,有时候可能都希望快速的使用电子签章的处理方式来给文件盖上特定的印章,本篇随笔介绍基于Vue&am ...

  5. 在基于ABP框架的前端项目Vue&Element项目中采用电子签名的处理

    在前面随笔介绍了<在基于ABP框架的前端项目Vue&Element项目中采用电子签章处理文件和打印处理>的处理,有的时候,我们在流程中或者一些文件签署的时候,需要签上自己的大名,一 ...

  6. vue cli3 项目配置

    [转]https://juejin.im/post/5c63afd56fb9a049b41cf5f4 基于vue-cli3.0快速构建vue项目 本章详细介绍使用vue-cli3.0来搭建项目. 本章 ...

  7. Vue 实际项目中你可能会遇见的坑

    纸上得来终觉浅,绝知此事要躬行! Vue的文档和教程看的太多,小的demo做的多,也不如自己实际的进行一个完整项目的开发.只有做了才知道原来问题这么多,这里列举了一些你做demo教程可能不会遇见的坑. ...

  8. Vue 实际项目中你可能会遇见问题

    纸上得来终觉浅,绝知此事要躬行! Vue的文档和教程看的太多,小的demo做的多,也不如自己实际的进行一个完整项目的开发.只有做了才知道原来问题这么多,这里列举了一些你做demo教程可能不会遇见的坑. ...

  9. Vue+webpack项目中实现跨域的http请求

    目前Vue项目中对json数据的请求一般使用两个插件vue-resource和axios, 但vue-resource已经不再维护, 而axios是官方推荐的且npm下载量已经170多万,github ...

  10. 如何Vue-cli开始使用在Vue.js项目中启动TDD(测试驱动开发)

    通常,使用测试驱动开发(TDD)最困难的部分是开始.你必须下载带有奇怪依赖项的软件包,让测试套件与你的构建系统协同工作,然后你必须弄清楚如何编写一个测试!难怪这么多的开发者在你提起它的时候就开始跑开了 ...

随机推荐

  1. IDEA在引入Maven项目后Dependencies中在出现红色波浪线

    解决方法: 移除pom.xml中相关依赖,再重新添加即可. 情况及具体解决方法如下: 1.在Maven Project中 Dependencies 出现红色波浪线,如图所示 2.查询本地仓库:jar包 ...

  2. Centos7下 升级php5.4到7.1 yum安装

    1.查看当前 PHP 版本 php -v 查看当前 PHP 相关的安装包,删除之 yum list installed | grep php yum remove php yum remove php ...

  3. OpenGL.英文

    1. emission 英 [iˈmɪʃn] 美 [iˈmɪʃn] 排放 n. (光.热.气等的)发出,射出,排放;排放物;散发物 material 英 [məˈtɪəriəl] 美 [məˈtɪri ...

  4. 第35课.函数对象分析("()"重载)

    1.编写一个函数 a.函数可以获得斐波那契数列 b.每调一次返回一个值 c.函数可以根据需要重复使用 2.函数数对象 a.使用具体的类对象取代函数 b.改类的对象具备函数调用的行为 c.构造函数指具体 ...

  5. Python时间日期格式化之time与datetime模块

    1 引言 在实际开发过程中,我们经常会用到日期或者时间,那么在Python中我们怎么获取时间,以及如何将时间转换为我们需要的格式呢?在之前的开发中,也曾遇到time.datetime等模块下的不同函数 ...

  6. vue2.0 + npm + webpack 开发===环境配置

     cnpm安装:npm install -g cnpm --registry=http://registry.npm.taobao.org 1.安装vue-cli脚手架构建工具cnpm install ...

  7. redis主从同步错误处理

    背景: 之前resis只有一台服务器(redis  master),现需要为其增加一台slave服务器(slave),做成一主一从 要求,不影响 master的正常情况下完成 . 1.配置slave: ...

  8. Java操作Excle(基于Poi)

    有一次有个同事问我会不会有java操作Excle,回答当然是不会了!感觉被嘲讽了,于是开始寻找度娘,找到个小例子,结果越写越有意思,最后就成就了这个工具类. import java.io.Buffer ...

  9. python 异常的理解

    对异常处理的意义在于,一些小概率异常且不是很严重的问题,如果没有处理,将直接导致程序停止,这显然不是我们想看到的,我们希望程序有一定的容错能力,能处理一些小异常. 但是我们要尽量避免使用try...e ...

  10. PostgreSQL练习

    学生表 Studentcreate table Student(Sid varchar(6), Sname varchar(10), Sage datetime, Ssex varchar(10)); ...