[webpack]path、publicPath、--content-base 理解
附源码:http://files.cnblogs.com/files/chenshao/startPublic.rar
'use strict';
var webpack = require('webpack');
var path = require('path'); //CLI:webpack-dev-server --content-base public module.exports = {
entry: path.join(__dirname,"src","entry.js"),
output: {
/*
webpack-dev-server环境下,path、publicPath、--content-base 区别与联系
path:指定编译目录而已(/build/js/),不能用于html中的js引用。
publicPath:虚拟目录,自动指向path编译目录(/assets/ => /build/js/)。html中引用js文件时,必须引用此虚拟路径(但实际上引用的是内存中的文件,既不是/build/js/也不是/assets/)。
--content-base:必须指向应用根目录(即index.html所在目录),与上面两个配置项毫无关联。
===================================================
发布至生产环境:
1.webpack进行编译(当然是编译到/build/js/)
2.把编译目录(/build/js/)下的文件,全部复制到/assets/目录下(注意:不是去修改index.html中引用bundle.js的路径)
*/
path: path.join(__dirname,"build","js"),
publicPath: "/assets/",
//publicPath: "http://cdn.com/assets/",//你也可以加上完整的url,效果与上面一致(不需要修改index.html中引用bundle.js的路径,但发布生产环境时,需要使用插件才能批量修改引用地址为cdn地址)。
filename: 'bundle.js'
}
};
[webpack]path、publicPath、--content-base 理解的更多相关文章
- webpack 配置 publicPath的理解
在学习webpack的时候,配置文件中有一个publicPath属性,一直不是很明白它到底是怎么用,也查了很多资料,得到最多的说法是当打包的时候,webpack会在静态文件路径前面添加publicPa ...
- webpack output的path publicPath
path是用来定义入口文件保存的地址,而publicPath是定义非入口文件需要抽离保存的第三方文件的保存地址 vue-cli 中HtmlWebpackPlugin生成html,都会存在path路径上 ...
- webpack output.publicPath
output.publicPath string function 对于按需加载(on-demand-load)或加载外部资源(external resources)(如图片.文件等)来说,outpu ...
- Webpack中publicPath设置
webpack中的path是当我们build的时候,输出项目打包文件的位置. webpack中的publicPath是我们打算放到web服务器下的目录,如果我们要放到网站的根目录下,那么就无需设置.如 ...
- Webpack 2 视频教程 014 - 深入理解 Webpack 2 中的 loader
原文发表于我的技术博客 这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲 ...
- webpack 模块热替换的理解和使用
模块热替换(webpack文档上也叫 Hot Module Replacement 或 HMR)是 webpack 提供的最有用的功能之一.它允许在运行时更新各种模块,而无需进行完全刷新. 这句话其实 ...
- 关于content的理解
Context字面意思上下文,位于framework packageandroid.content.Context中,其实该类为long型,类似Win32中的Handle句柄,很多方法需要通过 Con ...
- 深入理解webpack基本配置(一)
1. 安装webpack到全局 在学习构建之前,我们来在本地文件新建一个存放项目的文件夹,比如叫demo1这个项目,然后进入demo1该项目的根目录后,执行命令 npm init运行下,一路回车(先简 ...
- vue --- 脚手架初始化项目中配置文件webpack.base.conf.js代码含义
'use strict' //引入node path 中间件 可以获取到 path 路径的一些信息 const path = require('path') //引入utils工具模块 utils主要 ...
随机推荐
- 动态链接库编程:非MFC DLL
设计一个DLL,内含一个函数计算a+b: DLL的组成 .h(头文件) 定义了DLL能够导出的函数.数据结构或类的声明,该文件的声明内容在.CPP文件中实现,而.CPP的源程序被封装到DLL文件中 . ...
- HDU2577 How to Type 2016-09-11 14:05 29人阅读 评论(0) 收藏
How to Type Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Tota ...
- SSH框架中配置log4j的方法
SSH框架中使用log4j的方便之处 1. 动态的改变记录级别和策略,即修改log4j.properties,不需要重启Web应用,这需要在web.xml中设置一下.2. 把log文件定在 /WEB- ...
- Java中HTTP通信
Java自带的get.post请求: get请求方式: package com.java; import java.io.BufferedReader; import java.io.IOExcept ...
- Trystrtofloat
TryStrToFloat为 ‘+1’和‘-1’和 ‘.1’是可以装换成功的
- 一起学习MVC(1)初步了解MVC
MVC 即模型视图控制器(Model View Controller) 利于团队开发.便于管理与维护.代码易读性强.未来的主流开发框架结构. 当然,缺点也显而易见,与传统开发框架相比有很大的不 ...
- 安装CentOS桌面环境
CentOS 作为服务器的操作系统是很常见的,但是因为需要稳定而没有很时髦的更新,所以很少做为桌面环境.在服务器上通常不需要安装桌面环境,最小化地安装 CentOS(也就是 minimal CentO ...
- EasyUi 合并单元格占列显示
$("#TableContainer").datagrid({ url: '', method: "get&q ...
- java poi 获取单元格值时间
完整帮助类:JAVA poi 帮助类 /* * poi特殊日期格式:数字格式化成-yyyy年MM月dd日,格式 * */ private static ArrayList<String> ...
- ligerUI利用a标签下载文件
一.利用WriteFile实现下载,并验证文件是否存在,将指定的文件直接写入HTTP响应输出流.注意:大型文件使用此方法可能导致异常.可以使用此方法的文件大小取决于 Web 服务器的硬件配置. (1) ...