附源码: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 理解的更多相关文章

  1. webpack 配置 publicPath的理解

    在学习webpack的时候,配置文件中有一个publicPath属性,一直不是很明白它到底是怎么用,也查了很多资料,得到最多的说法是当打包的时候,webpack会在静态文件路径前面添加publicPa ...

  2. webpack output的path publicPath

    path是用来定义入口文件保存的地址,而publicPath是定义非入口文件需要抽离保存的第三方文件的保存地址 vue-cli 中HtmlWebpackPlugin生成html,都会存在path路径上 ...

  3. webpack output.publicPath

    output.publicPath string function 对于按需加载(on-demand-load)或加载外部资源(external resources)(如图片.文件等)来说,outpu ...

  4. Webpack中publicPath设置

    webpack中的path是当我们build的时候,输出项目打包文件的位置. webpack中的publicPath是我们打算放到web服务器下的目录,如果我们要放到网站的根目录下,那么就无需设置.如 ...

  5. Webpack 2 视频教程 014 - 深入理解 Webpack 2 中的 loader

    原文发表于我的技术博客 这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲 ...

  6. webpack 模块热替换的理解和使用

    模块热替换(webpack文档上也叫 Hot Module Replacement 或 HMR)是 webpack 提供的最有用的功能之一.它允许在运行时更新各种模块,而无需进行完全刷新. 这句话其实 ...

  7. 关于content的理解

    Context字面意思上下文,位于framework packageandroid.content.Context中,其实该类为long型,类似Win32中的Handle句柄,很多方法需要通过 Con ...

  8. 深入理解webpack基本配置(一)

    1. 安装webpack到全局 在学习构建之前,我们来在本地文件新建一个存放项目的文件夹,比如叫demo1这个项目,然后进入demo1该项目的根目录后,执行命令 npm init运行下,一路回车(先简 ...

  9. vue --- 脚手架初始化项目中配置文件webpack.base.conf.js代码含义

    'use strict' //引入node path 中间件 可以获取到 path 路径的一些信息 const path = require('path') //引入utils工具模块 utils主要 ...

随机推荐

  1. modelsim仿真中遇到的问题

    1.modelsim经常遇到数据位宽不相等的情况,这样往往仿真时是不会出数据的,如果用parameter定义了数据的位宽, 要注意实际的位宽数大于parameter定义参数能表示的位宽时,如: par ...

  2. linux上安装jdk1.8

    开发环境centos7, jdk1.8 首先去官网下载jdk1.8的linux64位安装包 进入目录/usr/local/mypackage/java 利用winscp上传jdk安装包 命令tar - ...

  3. Node.js是什么[译]

    当我向人们介绍Node.js的时候,一般会有两种反应:多数立刻表示“哦,这样啊”,另外的则会感到困惑. 如果你是第二种的话,我会试着这样解释node: 这是一个命令行工具.你可以下载一个tar包,然后 ...

  4. [译]Autoprefixer:一个以最好的方式处理浏览器前缀的后处理程序

    Autoprefixer解析CSS文件并且添加浏览器前缀到CSS规则里,使用Can I Use的数据来决定哪些前缀是需要的.   所有你需要做的就是把它添加到你的资源构建工具(例如 Grunt)并且可 ...

  5. VTK7.0.0编译安装心得

    配置:Win7(64bit)+VS2013+VTK700+QT5 (为了编译适应所用工业设备32bit,所有编译凑在32bit下进行) 预安装: (1)安装CMake软件,用于编译重构VTK源文件,编 ...

  6. 作为CTO如何做技术升级

    升级技术架构,先要革新观念,最后才是技术问题 升级技术架构,不仅仅是技术升级 说到升级架构,大家第一个都会想到,是不是对技术升级一下就可以了? 我认为不是,技术架构升级要求的是整个公司的升级. 技术架 ...

  7. What if you are involved in an automobile accident in the US

    What if you are involved in an automobile accident in the US With increasing Chinese tourists and vi ...

  8. 在Windows Server 2012 R2域环境中禁用(取消)密码复杂策略

    windows server 2012域环境默认启用密码复杂策略,例如: 至少有六个字符长,包含以下四类字符中的三类字符:英文大写字母(A 到 Z),英文小写字母(a 到 z),10 个基本数字(0 ...

  9. 基于JMS的ActiveMQ搭建与实现

    1.JMS Java消息服务(Java Message Service)即JMS,是一个Java平台中关于面向消息中间件的API,用于两个程序之间,或分布式系统中发送消息,进行异步通信. JMS包括队 ...

  10. git提交忽略文件或文件夹

    在项目根目录下面 添加 .gitignore文件 文件中每一行表示需要忽略的文件的正则表达式. .gitignore文件过滤有两种模式,开放模式和保守模式 1. 开放模式负责设置过滤哪些文件和文件夹 ...