修改vue+webpack run build的路径方法


Posted in Javascript onSeptember 01, 2018

vue项目用webpack打包想要修改静态资源路径等,找到项目根目录下的config文件夹,打开该文件夹下的index.js文件,默认如下:

// see http://vuejs-templates.github.io/webpack for documentation.
var path = require('path')

module.exports = {
 build: {
 env: require('./prod.env'),
 index: path.resolve(__dirname, '../dist/index.html'),
 assetsRoot: path.resolve(__dirname, '../dist'),
 assetsSubDirectory: 'static',
 assetsPublicPath: '/',
 productionSourceMap: true,
 // Gzip off by default as many popular static hosts such as
 // Surge or Netlify already gzip all static assets for you.
 // Before setting to `true`, make sure to:
 // npm install --save-dev compression-webpack-plugin
 productionGzip: false,
 productionGzipExtensions: ['js', 'css'],
 // Run the build command with an extra argument to
 // View the bundle analyzer report after build finishes:
 // `npm run build --report`
 // Set to `true` or `false` to always turn it on or off
 bundleAnalyzerReport: process.env.npm_config_report
 },
 dev: {
 env: require('./dev.env'),
 port: 8080,
 autoOpenBrowser: true,
 assetsSubDirectory: 'static',
 assetsPublicPath: '/',
 proxyTable: {},
 // CSS Sourcemaps off by default because relative paths are "buggy"
 // with this option, according to the CSS-Loader README
 // (https://github.com/webpack/css-loader#sourcemaps)
 // In our experience, they generally work as expected,
 // just be aware of this issue when enabling this option.
 cssSourceMap: false
 }
}

其中build.index:必须是本地文件系统上的绝对路径。会生成index.html文件。

build.assetsRoot:必须是本地文件系统上的绝对路径。

build.assetsSubDirectory:编译出来的资源文件。

build.assetsPublicPath:【资源的根目录】,这是通过http服务器运行的url路径。默认情况下,是根目录(/)。如果后台对静态资源url前缀要求,则需要改变这个路径。

build.productionSourceMap:在构建生产环境版本时是否开启source map。

以上这篇修改vue+webpack run build的路径方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript图像处理—虚拟边缘介绍及使用方法
Dec 27 Javascript
jQuery 的全选(全非选)即取得被选中的值使用介绍
Nov 12 Javascript
jquery修改属性值实例代码(设置属性值)
Jan 06 Javascript
jQueryUI 拖放排序遇到滚动条时有可能无法执行排序的小bug及解决方案
Dec 19 Javascript
js/jquery控制页面动态加载数据 滑动滚动条自动加载事件的方法
Feb 08 Javascript
js时间查询插件使用详解
Apr 07 Javascript
Vuex之理解state的用法实例
Apr 19 Javascript
vue.js使用代理和使用Nginx来解决跨域的问题
Feb 03 Javascript
angular 实现的输入框数字千分位及保留几位小数点功能示例
Jun 19 Javascript
详解在React.js中使用PureComponent的重要性和使用方式
Jul 10 Javascript
Vue如何实现响应式系统
Jul 11 Javascript
jQuery AJAX应用实例总结
May 19 jQuery
解决vue项目使用font-awesome,build后路径的问题
Sep 01 #Javascript
解决vue-cli项目webpack打包后iconfont文件路径的问题
Sep 01 #Javascript
解决vue 项目引入字体图标报错、不显示等问题
Sep 01 #Javascript
解决在vue项目中webpack打包后字体不生效的问题
Sep 01 #Javascript
vuejs 制作背景淡入淡出切换动画的实例
Sep 01 #Javascript
vue解决使用webpack打包后keep-alive不生效的方法
Sep 01 #Javascript
解决vue-router在同一个路由下切换,取不到变化的路由参数问题
Sep 01 #Javascript
You might like
PHP+APACHE实现用户论证的方法
2006/10/09 PHP
PHP判断搜索引擎蜘蛛并自动记忆到文件的代码
2012/02/04 PHP
Linux下编译redis和phpredis的方法
2016/04/07 PHP
php删除二维数组中的重复值方法
2018/03/12 PHP
制作特殊字的脚本
2006/06/26 Javascript
javascript encodeURI和encodeURIComponent的比较
2010/04/03 Javascript
JavaScript性能陷阱小结(附实例说明)
2010/12/28 Javascript
javascript 获取模态窗口的滚动位置代码
2013/08/06 Javascript
JQuery显示、隐藏div的几种方法简明总结
2015/04/16 Javascript
[原创]Bootstrap 中下拉菜单修改成鼠标悬停直接显示
2016/04/14 Javascript
纯JS代码实现一键分享功能
2016/04/20 Javascript
canvas实现图像布局填充功能
2017/02/06 Javascript
bootstarp modal框居中显示的实现代码
2017/02/18 Javascript
js实现选项卡效果
2020/03/07 Javascript
基于Vue2实现移动端图片上传、压缩、拖拽排序、拖拽删除功能
2021/01/05 Vue.js
vue 根据选择的月份动态展示日期对应的星期几
2021/02/06 Vue.js
[11:01]2014DOTA2西雅图邀请赛 冷冷带你探秘威斯汀
2014/07/08 DOTA
[56:38]DOTA2-DPC中国联赛正赛Aster vs Magma BO3 第一场 3月5日
2021/03/11 DOTA
Python随机数random模块使用指南
2016/09/09 Python
Python实现将Excel转换为json的方法示例
2017/08/05 Python
python+opencv识别图片中的圆形
2020/03/25 Python
python的turtle库使用详解
2019/05/10 Python
pyautogui自动化控制鼠标和键盘操作的步骤
2020/04/01 Python
Keras自定义IOU方式
2020/06/10 Python
python使用Word2Vec进行情感分析解析
2020/07/31 Python
CSS3教程(10):CSS3 HSL声明设置颜色
2009/04/02 HTML / CSS
HomeAway英国:全球领先的度假租赁在线市场
2020/02/03 全球购物
linux面试题参考答案(9)
2015/01/07 面试题
一些Solaris面试题
2015/12/22 面试题
汽车检测与维修专业求职信
2013/10/30 职场文书
银行领导证婚词
2014/01/11 职场文书
捐书活动总结
2014/05/04 职场文书
同学聚会策划方案
2014/06/06 职场文书
股权转让协议范本
2014/12/07 职场文书
详细聊一聊mysql的树形结构存储以及查询
2022/04/05 MySQL
微信小程序APP的生命周期及页面的生命周期
2022/04/19 Javascript