修改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 13 Javascript
javascript实现简单的Map示例介绍
Dec 23 Javascript
Javascript MVC框架Backbone.js详解
Sep 18 Javascript
前端必备神器 Snap.svg 弹动效果
Nov 10 Javascript
js实现显示当前状态的导航效果代码
Aug 28 Javascript
三种AngularJS中获取数据源的方式
Feb 02 Javascript
JS继承之借用构造函数继承和组合继承
Sep 07 Javascript
JS实现的几个常用算法
Nov 12 Javascript
详解Vue-Cli 异步加载数据的一些注意点
Aug 12 Javascript
JS实现获取毫秒值及转换成年月日时分秒的方法
Aug 15 Javascript
基于Vue实现的多条件筛选功能的详解(类似京东和淘宝功能)
May 07 Javascript
javascript实现fetch请求返回的统一拦截
Dec 22 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
PHP3 safe_mode 失效漏洞
2006/10/09 PHP
自写的利用PDO对mysql数据库增删改查操作类
2018/02/19 PHP
javascript cookie操作类的实现代码小结附使用方法
2010/06/02 Javascript
jQuery焦点控制图层展示延迟隐藏的方法
2015/03/09 Javascript
JavaScript让网页出现渐隐渐显背景颜色的方法
2015/04/21 Javascript
JavaScript+html5 canvas绘制缤纷多彩的三角形效果完整实例
2016/01/26 Javascript
原生JS实现首页进度加载动画
2016/09/14 Javascript
详解JS-- 浮点数运算处理
2016/11/28 Javascript
Bootstrap组合上、下拉框简单实现代码
2017/03/06 Javascript
基于JQuery的购物车添加删除以及结算功能示例
2017/03/08 Javascript
ReactNative实现图片上传功能的示例代码
2017/07/11 Javascript
vue2手机APP项目添加开屏广告或者闪屏广告
2017/11/28 Javascript
详解react-redux插件入门
2018/04/19 Javascript
JS/jQuery实现获取时间的方法及常用类完整示例
2019/03/07 jQuery
vue 父组件通过$refs获取子组件的值和方法详解
2019/11/07 Javascript
在 Vue 中使用 JSX 及使用它的原因浅析
2020/02/10 Javascript
vue或react项目生产环境去掉console.log的操作
2020/09/02 Javascript
python计算书页码的统计数字问题实例
2014/09/26 Python
Python lambda和Python def区别分析
2014/11/30 Python
Python卸载模块的方法汇总
2016/06/07 Python
python3写爬取B站视频弹幕功能
2017/12/22 Python
python实现RabbitMQ的消息队列的示例代码
2018/11/08 Python
Django 大文件下载实现过程解析
2019/08/01 Python
Python 使用 PyMysql、DBUtils 创建连接池提升性能
2019/08/14 Python
pymysql 开启调试模式的实现
2019/09/24 Python
python、Matlab求定积分的实现
2019/11/20 Python
python isinstance函数用法详解
2020/02/13 Python
营销人才自我鉴定范文
2013/12/25 职场文书
乔迁宴答谢词
2014/01/21 职场文书
技术总监管理岗位职责
2014/03/09 职场文书
企业办公室岗位职责
2014/03/12 职场文书
《爱的教育》读书心得
2014/11/08 职场文书
2014年电厂个人工作总结
2014/11/27 职场文书
市场部岗位职责
2015/02/12 职场文书
第一书记观后感
2015/06/08 职场文书
证婚人致辞精选
2015/07/28 职场文书