电脑知识|欧美黑人一区二区三区|软件|欧美黑人一级爽快片淫片高清|系统|欧美黑人狂野猛交老妇|数据库|服务器|编程开发|网络运营|知识问答|技术教程文章 - 好吧啦网

您的位置:首頁技術文章
文章詳情頁

vue webpack build資源相對路徑的問題及解決方法

瀏覽:12日期:2023-01-16 11:41:47

默認情況webpack+vue-cli打包的css、js等靜態資源路徑都是絕對的,即static在根目錄下,如果部署到帶有文件夾目錄的項目中,資源路徑就會出錯。如圖:

vue webpack build資源相對路徑的問題及解決方法vue webpack build資源相對路徑的問題及解決方法vue webpack build資源相對路徑的問題及解決方法

解決方法:

在webpack.prod.conf.js中,output中添加或者修改為 publicPath: ‘./’;

output: { publicPath: ’./’, path: config.build.assetsRoot, filename: utils.assetsPath(’js/[name].[chunkhash].js’), chunkFilename: utils.assetsPath(’js/[id].[chunkhash].js’) },

這是修改了js,css引用地址,那么image引用地址呢?

vue webpack build資源相對路徑的問題及解決方法

config文件夾下面的index build: { // Template for index.html index: path.resolve(__dirname, ’../monitor01/index.html’), // Paths assetsRoot: path.resolve(__dirname, ’../monitor01’), assetsSubDirectory: ’static’, assetsPublicPath: ’./’, ... }

vue webpack build資源相對路徑的問題及解決方法

更改圖片地址也為相對路徑,修改build下,utils.js文件.

if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, fallback: ’vue-style-loader’, publicPath: ’../../’ }) } else { return [’vue-style-loader’].concat(loaders) }

vue webpack build資源相對路徑的問題及解決方法

總結

到此這篇關于vue webpack build資源相對路徑的問題及解決方法的文章就介紹到這了,更多相關vue webpack build資源相對路徑內容請搜索好吧啦網以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持好吧啦網!

標簽: Vue
相關文章:
主站蜘蛛池模板: 全自动包装机_灌装机生产厂家-迈驰包装设备有限公司 | SRRC认证_电磁兼容_EMC测试整改_FCC认证_SDOC认证-深圳市环测威检测技术有限公司 | 河南膏药贴牌-膏药代加工-膏药oem厂家-洛阳今世康医药科技有限公司 | 自动化生产线-自动化装配线-直流电机自动化生产线-东莞市慧百自动化有限公司 | 驾驶人在线_专业学车门户网站 | 企小优-企业数字化转型服务商_网络推广_网络推广公司 | 洛阳永磁工业大吊扇研发生产-工厂通风降温解决方案提供商-中实洛阳环境科技有限公司 | 软文世界-软文推广-软文营销-新闻稿发布-一站式软文自助发稿平台 | 首页_中夏易经起名网| 防水试验机_防水测试设备_防水试验装置_淋雨试验箱-广州岳信试验设备有限公司 | 小型手持气象站-空气负氧离子监测站-多要素微气象传感器-山东天合环境科技有限公司 | 广州二手电缆线回收,旧电缆回收,广州铜线回收-广东益福电缆线回收公司 | 英语词典_成语词典_日语词典_法语词典_在线词典网 | 保定市泰宏机械制造厂-河北铸件厂-铸造厂-铸件加工-河北大件加工 | 无纺布包装机|径向缠绕包装机|缠绕膜打包机-上海晏陵智能设备有限公司 | 乳化沥青设备_改性沥青设备_沥青加温罐_德州市昊通路桥工程有限公司 | 爱佩恒温恒湿测试箱|高低温实验箱|高低温冲击试验箱|冷热冲击试验箱-您身边的模拟环境试验设备技术专家-合作热线:400-6727-800-广东爱佩试验设备有限公司 | 紫外可见光分光度计-紫外分光度计-分光光度仪-屹谱仪器制造(上海)有限公司 | 超高频感应加热设备_高频感应电源厂家_CCD视觉检测设备_振动盘视觉检测设备_深圳雨滴科技-深圳市雨滴科技有限公司 | 气动绞车,山东气动绞车,气动绞车厂家-烟台博海石油机械有限公司 气动隔膜泵厂家-温州永嘉定远泵阀有限公司 | 石英陶瓷,石英坩埚,二氧化硅陶瓷-淄博百特高新材料有限公司 | 专业生产动态配料系统_饲料配料系统_化肥配料系统等配料系统-郑州鑫晟重工机械有限公司 | 天津电机维修|水泵维修-天津晟佳机电设备有限公司 | 家用净水器代理批发加盟_净水机招商代理_全屋净水器定制品牌_【劳伦斯官网】 | 太阳能发电系统-太阳能逆变器,控制器-河北沐天太阳能科技首页 | 焊管生产线_焊管机组_轧辊模具_焊管设备_焊管设备厂家_石家庄翔昱机械 | 东莞喷砂机-喷砂机-喷砂机配件-喷砂器材-喷砂加工-东莞市协帆喷砂机械设备有限公司 | 点胶机_点胶阀_自动点胶机_智能点胶机_喷胶机_点胶机厂家【欧力克斯】 | 大流量卧式砂磨机_强力分散机_双行星双动力混合机_同心双轴搅拌机-莱州市龙跃化工机械有限公司 | 广东恩亿梯电源有限公司【官网】_UPS不间断电源|EPS应急电源|模块化机房|电动汽车充电桩_UPS电源厂家(恩亿梯UPS电源,UPS不间断电源,不间断电源UPS) | 华东师范大学在职研究生招生网_在职研究生招生联展网 | 有机肥设备生产制造厂家,BB掺混肥搅拌机、复合肥设备生产线,有机肥料全部加工设备多少钱,对辊挤压造粒机,有机肥造粒设备 -- 郑州程翔重工机械有限公司 | 西门子气候补偿器,锅炉气候补偿器-陕西沃信机电工程有限公司 | 施工电梯_齿条货梯_烟囱电梯_物料提升机-河南大诚机械制造有限公司 | 瑞典Blueair空气净化器租赁服务中心-专注新装修办公室除醛去异味服务! | 长沙发电机-湖南发电机-柴油发电机供应厂家-长沙明邦智能科技 | 深圳富泰鑫五金_五金冲压件加工_五金配件加工_精密零件加工厂 | 818手游网_提供当下热门APP手游_最新手机游戏下载 | 合肥活动房_安徽活动板房_集成打包箱房厂家-安徽玉强钢结构集成房屋有限公司 | 马尔表面粗糙度仪-MAHR-T500Hommel-Mitutoyo粗糙度仪-笃挚仪器 | 水冷散热器_水冷电子散热器_大功率散热器_水冷板散热器厂家-河源市恒光辉散热器有限公司 |