1、首先index.html 中配置cdn 引入

<!-- 引入样式 -->
<link rel="stylesheet" href="//cdn.bootcss.com/element-ui/2.12.0/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="//cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
<script src="//cdn.bootcss.com/element-ui/2.12.0/index.js"></script>
<script src="//cdn.bootcss.com/vue-router/3.0.1/vue-router.min.js"></script>

2、main.js 引用

import ElementUI from 'element-ui';
Vue.use(ElementUI)

3、build/webpack.base.conf.js 中定义声明

module.exports = {
...
externals: {
'vue': 'Vue',
'vue-router': 'VueRouter',
'element-ui': 'ELEMENT',
},

4、package.json 去除

"dependencies": {
//"element-ui": "^2.12.0",
//"vue": "^2.5.2",
//"vue-resource": "^1.5.0",
//"vue-router": "^3.0.1",
},

记住:element 要在vue 后面,否则报错。其他的包也类似,这样 页面加载速度不能说飞快,但有质的提升

vue 配置CDN加速的更多相关文章

  1. WP Super Cache+七牛云配置CDN加速,让你的网站秒开

    CDN加速网站是几乎所有的站长都在考虑的问题,CDN,全称是Content Delivery Network,即内容分发网络.所谓CDN加速,通俗的来说就是把原服务器上数据复制到其他服务器上,用户访问 ...

  2. vue项目性能优化(路由懒加载、gzip加速、cdn加速)

    前端工程性能优化一说意义深远悠长,本章主要介绍除了一些基础优化外如何实行路由懒加载.Gzip加速.CDN加速,让网页飞的快一些. 基础优化 老生常谈的一些: 不要在模板中写复杂的表达式 慎用watch ...

  3. 【转】七牛免费SSL证书,配置自定义域名CDN加速

    原文链接:https://excaliburhan.com/post/use-qiniu-ssl-and-cdn.html 申请七牛SSL证书 其实,七牛在很早之前就支持CDN使用https,但是他要 ...

  4. 申请免费域名并配置DNS解析及CDN加速

    标题: 申请免费域名并配置DNS解析及CDN加速 作者: 梦幻之心星 sky-seeker@qq.com 标签: [#申请,#免费,#域名,#DNS解析,#CDN加速,#子域名] 目录: [网站] 日 ...

  5. 阿里云对象存储OSS及CDN加速配置

    目录 十大云存储服务商 1. 登陆阿里云官网,开通对象存储服务 OSS 2. 创建存储空间 3. 绑定自定义域名 4. 配置阿里云CDN加速 5. 购买阿里云免费SSL证书 6. 阿里云CDN配置HT ...

  6. 阿里云系列——6.给你的域名使用CDN加速(详细步骤+简单配置)

    网站部署之~阿里云系列汇总 http://www.cnblogs.com/dunitian/p/4958462.html 进入管理页面:https://home.console.aliyun.com/ ...

  7. vue-cli3项目首页加载速度优化(cdn加速,路由懒加载,gzip压缩)

    今天打算上线vue的单页面项目,上线后,首页加载速度巨慢! 原因是项目上线后,网速不够快,加载js,css等资源很慢, 打开打包好的文件发现chunk-vendors.xxxxxxx.js的包很大,达 ...

  8. 【初码干货】使用阿里云对Web开发中的资源文件进行CDN加速的深入研究和实践

    提示:阅读本文需提前了解的相关知识 1.阿里云(https://www.aliyun.com) 2.阿里云CDN(https://www.aliyun.com/product/cdn) 3.阿里云OS ...

  9. Signalr系列之虚拟目录详解与应用中的CDN加速实战

    目录 对SignalR不了解的人可以直接移步下面的目录 SignalR系列目录 前言 前段时间一直有人问我 在用SignalR 2.0开发客服系统[系列1:实现群发通讯]这篇文章中的"/Si ...

随机推荐

  1. 剑指offer36:两个链表的第一个公共结点

    1 题目描述 输入两个链表,找出它们的第一个公共结点. 2 思路和方法 方法一: 用两个指针同时从两个链表的表头开始走,当走到自己的链表结尾的时候开始从另一个链表的表头开始向后走.终止条件就是两个指针 ...

  2. Ubuntu16.04安装kubernetes1.13集群

    Ubuntu16.04安装kubernetes1.13集群 最新的安装可以使用以下方式:https://www.cnrancher.com/docs/rancher/v2.x/cn/overview/ ...

  3. docker网络相关

    1.网卡有namespace的概念,不同的俩个namesp之间的网卡不能直接通信 为了俩个namespace的网卡相互通信,可以通过veth pair(一对)来实现.不同容器之间,便是通过veth p ...

  4. 表空间 oracle

    --create table create table table_name ( column1 varchar2(20) not null, column2 number(8) not null, ...

  5. day12-python之深灰魔法

    #######################################灰魔法: list类中提供的方法   列表####################################### ...

  6. MSPBSL_Scripter编译

    The BSL Scripter is a PC application that is available for Windows, Linux and Mac OS X. It is a user ...

  7. 使用apache的HttpClient进行http通讯,隐藏的HTTP请求头部字段是如何自动被添加的

    我们用apache的HttpClient这个库消费云端的Restful API时,一般都需要两次HTTP调用,第一次获得某种token,比如获取防止跨域请求伪造攻击Cross-site request ...

  8. Oracle 数据 查询 一对多 取最新一条非 0 数据

    主键id     待查字段     日期 1            6             2019/5/1 1            0             2019/5/2 需求: 找出 ...

  9. 【leetcode】575. Distribute Candies

    原题 Given an integer array with even length, where different numbers in this array represent differen ...

  10. vi/vim常用按键

    最近这段时间坚持了vim的使用,我在我的IDEA里面加了一个插件,可以支持vim. 然后不管是IDEA还是Vim都有自己的按键,而且都很好用,所以我就总结下在IDEA下的vim使用命令 当然,都是原生 ...