webpack脚手架增加版本号
1.product模式下,新增版本号:
1)common.js文件中,输出的文件路径要跟着变化 output: {
filename: 'js/[name].js',
path: path.resolve(__dirname, '../dist/'+config.version+'/'),
publicPath: config.publicPath + '/'+config.version+'/',
}, 2) 插件中的html也要修改html的路径
new HtmlWebpackPlugin({
template: path.resolve(__dirname, '../src/index.html'),
filename: path.resolve(__dirname, '../dist/index.html'),
}), 3) production文件
const config = require('../package.json');
let vendorVersion = config.vendorVersion? config.vendorVersion :'';
插件中新增
new CopyWebpackPlugin([ //文件复制到打包的 dist/lib 文件夹下
{ from: path.join(__dirname, "../static/libVendor.dll.js"), to: path.join(__dirname, "../dist/"+vendorVersion+"/lib/libVendor.dll.js") }
]),
new htmlWebpackIncludeAssetsPlugin({ //这个插件是把vue.dll.js 插入到 html 中
assets:[vendorVersion+'/lib/libVendor.dll.js'],
publicPath:config.publicPath,
append:false
}), --------------------
2. dev模式下
common.js 文件
1) 输出文件的公共路径改为跟路径:/
output.publicPath:'/'
2) 插件中去掉 filename
new HtmlWebpackPlugin({
template: path.resolve(__dirname, '../src/index.html'),
//filename: path.resolve(__dirname, '../dist/index.html'),
}),
因为webpack-dev-server 走的是内存中的代码,设置html模版即可,不要设置filename(即输出路径),
否则找不到html; //注意:
注意在dev或production中 插件 HtmlWebpackPlugin 都要放在其他插件前面,否则报错!!
webpack脚手架增加版本号的更多相关文章
- 从0开始搭建vue+webpack脚手架(二)
接着从0开始搭建vue+webpack脚手架(一) 三.配置webpack-dev-server 1. webpack-dev-server自带一个node的服务器, 项目在服务端运行的同时可以实现热 ...
- 在基于vue的webpack脚手架开发中使用了代理转发,结果浏览器发出的请求中不带cookie导致登录时总是session失效怎么办?
环境: 有2个业务接口需要转发到82的服务器上: ../user/getCode.do ../user/doLogin.do 现象: 使用上述的 ...
- Egret版本更新(H5增加版本号)
由于浏览器缓存问题.在服务器上更新了新的图片等资源以后,客户端并不会下载最新的. 关于浏览器缓存机制,可自行百度. Egret中资源更新解决方案有以下: 一 资源名后增加版本号 二 重写Egret引擎 ...
- 从0开始搭建vue+webpack脚手架(三)
在从0开始搭建vue+webpack脚手架(二)中已经基本完成了开发环境的配置.当开发完成后,我们需要将完成的项目进行打包,接下来对打包做一些优化: 运行 $ npm run build 可生成dis ...
- Vue.js 在 webpack 脚手架中使用 cssnext
Vue.js 的 webpack脚手架默认已经使用了 PostCSS 的 autoprefixer 的功能. 如果想使用下一代 css语法,即cssnext: 1. 安装依赖 npm install ...
- 从0开始搭建vue+webpack脚手架(一)
基于多数情况下都是使用vue-cli初始化项目, 却始终未去了解其原理.从零开始搭建,可以让自己更深层次的理解框架. 首先从最基本的npm 开始, 至于安装npm 和 node就不用再赘述了,那是前端 ...
- 极简版 react+webpack 脚手架
目录结构 asset/ css/ img/ src/ entry.js ------------------------ 入口文件 .babelrc index.html package.json w ...
- webpack脚手架搭建(简单版)
运行命令 安装依赖:npm install 运行项目:npm start 大致流程 npm init:新建 package.json 将需要的依赖模块加入 dependencies(生产环境) 和 d ...
- webpack简单修改版本号(单页面)
写了一个js文件,可以尽量最简单的修改版本号 package.json配置: updateV.js放置位置: updateV.js: var fs = require('fs'); //文件读写 va ...
随机推荐
- python数据分析3之标签化
- [ERROR ]Failed to execute goal org.codehaus.mojo:flatten-maven-plugin:1.1.0:flatten (flatten) on project
今天在启动项目的时候,莫名的Maven install命令的时候出现错误 错误提示:Failed to execute goal org.codehaus.mojo:flatten-maven-plu ...
- Gradle之dependenciens的各种依赖说明
implementation:对于使用了该命令编译的依赖,对该项目有依赖的项目将无法访问到使用该命令编译的依赖中的任何程序,也就是将该依赖隐藏在内部,而不对外部公开.api 完全等同于compile指 ...
- .NET平台历程介绍
.Net平台的背景 1. 2010之前 的PC时代的时候,互联网规模还不是特别庞大,以静态编译式语言为代表的JAVA和.Net没什么太大区别,.net以windows自居. 2. 2010年以JAVA ...
- Node.js 开发指南-读书笔记
1. Node.js 使用了单 线程.非阻塞的事件编程模式 Node.js 最大的特点就是采用异步式 I/O 与事件驱动的架构设计.对于高并发的解决方 案,传统的架构是多线程模型,也就是为每个业务逻辑 ...
- 抽象工厂(AbstractFactory)模式
抽象工厂模式又称工具箱模式.其实抽象工厂模式可以简单的理解为一个工厂生成一个产品族的产品. 抽象工厂模式可以向客户端提供一个接口,使得客户端在不指定产品的具体类型的情况下,创建多个产品族中的产品对象. ...
- pytest_使用自定义标记mark
前言 pytest可以支持自定义标记,自定义标记可以把一个web项目划分多个模块,然后指定模块名称执行.app自动化的时候,如果想android和ios公用一套代码时,也可以使用标记功能,标明哪些是i ...
- Kafka学习笔记(三)——架构深入
之前搭建好了Kafka的学习环境,了解了具体的配置文件内容,并且测试了生产者.消费者的控制台使用方式,也学习了基本的API.那么下一步,应该学习一下具体的内部流程~ 1.Kafka的工作流程 大致的工 ...
- C#/.NET 中启动进程时所使用的 UseShellExecute 设置为 true 和 false 分别代表什么意思?
原文:C#/.NET 中启动进程时所使用的 UseShellExecute 设置为 true 和 false 分别代表什么意思? 在 .NET 中创建进程时,可以传入 ProcessStartInfo ...
- Delphi中AssignFile函数
procedure TForm1.SaveLog(sFlag:string;MSG:string);var QF1:Textfile; ----声明文本文件类型 Qfiletmp,sP ...