关于webpack的cdn配置
在webpack中活用cdn可以大幅度减少打包文件的体积,配置方法也非常简单。
首先现在入口html文件(index.html)里引入相应cdn连接,然后配置webpack:
module.exports = {
externals: {
"vue": "Vue"
},
...
}
配置cdn主要利用了externals(外部的)选项,key表示的是包名,即package.json中包的名称,value表示的是包导出的类名。比如说vue包导出的类名是Vue,vue-router导出的类名是VueRouter。类名很重要,不能乱写,不然就会报找不到变量的错。
想知道导出的类名可以先在一个空白的html文件里引入cdn文件,然后打开控制台,输入包名的头几个字母,出现的智能提示就是类名。
比如vuex的类名就是Vuex,由于vuex比较小,这里就直接复制粘贴到控制台作为演示了
关于webpack的cdn配置的更多相关文章
- 深入浅出 webpack 之基础配置篇
前言 前端工程化经历过很多优秀的工具,例如 Grunt.Gulp.webpack.rollup 等等,每种工具都有自己适用的场景,而现今应用最为广泛的当属 webpack 打包了,因此学习好 webp ...
- vue预渲染及其cdn配置
VUE SEO方案一 - 预渲染及其cdn配置 项目接入VUE这样的框架后,看起来真是太漂亮了,奈何与MCV框架比起来,单页应用程序却满足不了SEO的业务需求,首屏渲染时间也是个问题.总不能白学VUE ...
- webpack + vuejs 基本配置(一)
开始之前 本文包含以下技术,文中尽量给与详细的描述,并且附上参考链接,读者可以深入学习: 1.webpack2.Vue.js3.npm4.nodejs —- 这个就不给连接了,因为上面的连接都是在你实 ...
- webpack react基础配置一
简单介绍webpack react基本配置,入门型: 环境配置: 依赖nodejs,官网下载最新版的nodejs:nodejs.org/en 安装完nodejs npm便自动集成了,通过npm安装其 ...
- webpack 多entry 配置
// webpack 多entry 配置var path = require('path'); module.exports = { entry: { entry2: './entry.js', de ...
- react+webpack开发环境配置
react是目前非常热门的前端框架,提倡组件化开发.所谓的组件,简单理解,就是一个独立的页面部件(包括页面模版,样式,逻辑等),它是一个独立的整体. webpack,是一个模块打包工具,其主要功能,就 ...
- webpack的简单配置
本人刚开始也不会写webpack配置,刚开始在网上搜索了了一些,看的也是刚刚理解,所以准备自己写下来,已作纪念和贡献给像我一样不会配置的“童鞋”们! 1.创建webpack配置文件 在项目文件下创建一 ...
- Webpack 2 视频教程 019 - Webpack 2 中配置多页面编译
原文发表于我的技术博客 这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲 ...
- Webpack的基本配置
一.优化项目结构,创建相关的文件,项目结构如下:src文件夹存放相关js文件,index.html项目的首页面,dist文件夹是webpack 打包 目录. index.js内容为: alert('我 ...
随机推荐
- Http状态码(了解)
一些常见的http状态码 200 - OK,服务器成功返回网页 - Standard response for successful HTTP requests. 301 - Moved Pe ...
- PowerShell批量配置VM端点
我们可以通过PowerShell脚本批量添加VM端点.请您参考以下方案. 准备工作 – PowerShell连接China Azure 1. 从官网下载页面,下载并安装Windows Azure Po ...
- day09 threading, paramiko, queue 模块
1 模拟ssh 2 锁 内部锁,程序锁,信号量 3 多线程 4 简单消息队列 先来看模拟ssh ,python 的强大之处就是因为有很多模块,可以很简单的完成复杂的事情,今天我们用paramiko ...
- python-os模块及md5加密
常用内置方法 __doc__打印注释 __package__打印所在包 __cached__打印字节码 __name__当前为主模块是__name__ == __main__ __file__打印文件 ...
- LeetCode118 杨辉三角 Python
给定一个非负整数 numRows,生成杨辉三角的前 numRows 行. 示例:输入: 5 输出: [ [1], [1,1], [1,2,1], [1,3,3,1], [1,4,6,4,1] ] cl ...
- 关于在smarty中实现省市区三级联动
刚开始接触php,,其实对于一些比较深入的东西还不是很了解,就像是这次的省市区联动,都是用三张表为基础编码的,原谅我的无知,谢谢. 接下来就是编码部分了: <?php require('./sm ...
- WS-*协议栈及相关概念
1. 什么是WS-Security? WS-Security 是一个 SOAP 的扩展,它提供了对 SOAP 消息的认证和加密. 在介绍 WS-Security 之前,我们有必要了解一下 WS-Sec ...
- Apache+Openssl
Apache编译还需要一些依赖: #./configure --prefix……检查编辑环境时出现: checking for APR... no configure: error: APR not ...
- windows杀死进程netstat
1.找到端口被占用情况 netstat -aon|findstr "9050" 协议 本地地址 外部地址 ...
- Linux调用fork()编程
本文出自:svitter's blog #include <iostream> #include <cstdio> #include <unistd.h> usin ...