修改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 相关文章推荐
让AJAX不依赖后端接口实现方案
Dec 03 Javascript
JQuery 图片滚动轮播示例代码
Mar 24 Javascript
IE下通过a实现location.href 获取referer的值
Sep 04 Javascript
js实现用户注册协议倒计时的方法
Jan 21 Javascript
JS选项卡动态替换banner图片路径的方法
May 11 Javascript
jQuery手动点击实现图片轮播特效
Apr 20 Javascript
BootStrap中按钮点击后被禁用按钮的最佳实现方法
Sep 23 Javascript
详解打造 Vue.js 可复用组件
Mar 24 Javascript
node.js连接MongoDB数据库的2种方法教程
May 17 Javascript
详解在Angular项目中添加插件ng-bootstrap
Jul 04 Javascript
Babel 入门教程学习笔记
Jun 13 Javascript
使用Webpack 搭建 Vue3 开发环境过程详解
Jul 28 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
php安装swoole扩展的方法
2015/03/19 PHP
如何使用GDB调试PHP程序
2015/12/08 PHP
ThinkPHP5.0框架实现切换数据库的方法分析
2019/10/30 PHP
ExtJS 2.0实用简明教程 之ExtJS版的Hello
2009/04/29 Javascript
window.open关于浏览器拦截问题分析及解决方法
2013/02/05 Javascript
jQuery bxCarousel实现图片滚动切换效果示例代码
2013/05/15 Javascript
js编码、解码函数介绍及其使用示例
2013/09/05 Javascript
javascript函数作用域学习示例(js作用域)
2014/01/13 Javascript
jquery日历控件实现方法分享
2014/03/07 Javascript
jquery选择器使用详解
2014/04/08 Javascript
jQuery+ajax实现动态执行脚本的方法
2015/01/27 Javascript
[js高手之路]寄生组合式继承的优势详解
2017/08/28 Javascript
JS异步执行结果获取的3种解决方式
2019/02/19 Javascript
微信小程序事件对象中e.target和e.currentTarget的区别详解
2019/05/08 Javascript
Bootstrap实现省市区三级联动(亲测可用)
2019/07/26 Javascript
vue 根据选择条件显示指定参数的例子
2019/11/09 Javascript
从0到1学习JavaScript编写贪吃蛇游戏
2020/07/28 Javascript
[00:17]游戏风云独家报道:DD赛后说出数字秘密 吓死你们啊!
2014/07/13 DOTA
PyQt 线程类 QThread使用详解
2017/07/16 Python
python先序遍历二叉树问题
2017/11/10 Python
tensorflow实现简单的卷积网络
2018/05/24 Python
解决每次打开pycharm直接进入项目的问题
2018/10/28 Python
python的schedule定时任务模块二次封装方法
2019/02/19 Python
利用CSS3的border-radius绘制太极及爱心图案示例
2016/05/17 HTML / CSS
Html5踩坑记之mandMobile使用小记
2020/04/02 HTML / CSS
卡塔尔航空官方网站:Qatar Airways
2017/02/08 全球购物
医疗保健专业人士购物网站:Scrubs & Beyond
2017/02/08 全球购物
Under Armour安德玛法国官网:美国高端运动科技品牌
2018/06/29 全球购物
中国包裹转运寄送国际服务:Famiboat
2019/07/24 全球购物
请解释一下webService? 如何用.net实现webService
2014/06/09 面试题
销售内勤岗位职责
2014/04/15 职场文书
介绍长城的导游词
2015/01/30 职场文书
青岛导游词
2015/02/12 职场文书
考研经验交流会策划书
2015/11/02 职场文书
运动会班级口号霸气押韵
2015/12/24 职场文书
以MySQL5.7为例了解一下执行计划
2022/04/13 MySQL