修改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 相关文章推荐
jquery用offset()方法获得元素的xy坐标
Sep 06 Javascript
jQuery往textarea中光标所在位置插入文本的方法
Jun 26 Javascript
详解微信小程序开发之下拉刷新 上拉加载
Nov 24 Javascript
JS jQuery使用正则表达式去空字符的简单实现代码
May 20 jQuery
详解Vuejs2.0 如何利用proxyTable实现跨域请求
Aug 03 Javascript
详解Vue结合后台的列表增删改案例
Aug 21 Javascript
vue.js 2.0实现简单分页效果
Jul 29 Javascript
layui多iframe页面控制定时器运行的方法
Sep 05 Javascript
jQuery实现带进度条的轮播图
Sep 13 jQuery
解决nuxt 自定义全局方法,全局属性,全局变量的问题
Nov 05 Javascript
JavaScript中关于预编译、作用域链和闭包的理解
Mar 31 Javascript
js实现自动锁屏功能
Jun 02 Javascript
解决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
Mysql的常用命令
2006/10/09 PHP
PHP获取客户端真实IP地址的5种情况分析和实现代码
2014/07/08 PHP
PHP获取当前完整URL地址的函数
2014/12/21 PHP
JSON字符串传到后台PHP处理问题的解决方法
2016/06/05 PHP
PHP面向对象程序设计类的定义与用法简单示例
2016/12/27 PHP
jQuery结合Json提交数据到Webservice,并接收从Webservice返回的Json数据
2011/02/18 Javascript
Javascript Request获取请求参数如何实现
2012/11/28 Javascript
js给onclick事件赋值,动态传参数实例解说
2013/03/28 Javascript
JS实现网页标题随机显示名人名言的方法
2015/11/03 Javascript
Vue.js每天必学之过滤器与自定义过滤器
2016/09/07 Javascript
AngularJS入门教程之表单校验用法示例
2016/11/02 Javascript
vue 表单验证按钮事件交由父组件触发的方法
2018/12/17 Javascript
jQuery动态生成的元素绑定事件操作实例分析
2019/05/04 jQuery
Layer+Echarts构建弹出层折线图的方法
2019/09/25 Javascript
微信小程序网络请求实现过程解析
2019/11/06 Javascript
JS函数基本定义与用法示例
2020/01/15 Javascript
[01:06:32]DOTA2上海特级锦标赛D组资格赛#1 EG VS VP第一局
2016/02/28 DOTA
Python语言的12个基础知识点小结
2014/07/10 Python
在Ubuntu系统下安装使用Python的GUI工具wxPython
2016/02/18 Python
对python自动生成接口测试的示例讲解
2018/11/30 Python
python实现学员管理系统
2019/02/26 Python
python实现静态服务器
2019/09/05 Python
Python使用APScheduler实现定时任务过程解析
2019/09/11 Python
pytorch实现focal loss的两种方式小结
2020/01/02 Python
如何使用Python处理HDF格式数据及可视化问题
2020/06/24 Python
Python xlwings插入Excel图片的实现方法
2021/02/26 Python
CheapTickets香港机票预订网站:CheapTickets.hk
2019/06/26 全球购物
给校长的一封建议书
2014/03/12 职场文书
营销与策划专业求职信
2014/06/20 职场文书
施工单位安全责任书
2014/07/24 职场文书
工作汇报开头与结尾怎么写
2014/11/08 职场文书
优秀团队申报材料
2014/12/26 职场文书
教师工作态度自我评价
2015/03/05 职场文书
校园文化艺术节开幕词
2016/03/04 职场文书
JS异步堆栈追踪之为什么await胜过Promise
2021/04/28 Javascript
Python torch.flatten()函数案例详解
2021/08/30 Python