vue打包之后修改静态资源路径

npm run build打包之后生成dist文件夹,访问index.html的时候控制台打印
打包之后报错在这里插入图片描述
1:修改build下webpack.prod.conf.js
在这里插入图片描述
2:修改build下webpack.base.conf.js
在这里插入图片描述
3:修改config下index.js
在这里插入图片描述
4:我的项目静态资源的位置在src下的assets文件夹里,引入了背景图打包之后不显示
修改build下utils.js
在这里插入图片描述
在这里插入图片描述

若我君临天下
关注 关注
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
nuxt静态部署打包相对路径操作
01-22
以往在nuxt项目中,打包静态化部署的的文件如下: 路径为绝对路径,当项目的域名为二级域名的时候,就不能打包为这绝对路径了。 nuxt不同于vue项目,思索了许久,终于找到了配置的地方: nuxt项目中 nuxt.config.js : module.exports = { router: { base: './' } } 打包后的文件: 补充知识:nginx部署,nuxt静态部署,路由跳转失效的问题 nuxt静态部署问题 静态部署:路由模式跳转失效的问题;不能使用历史模式,需要使用 ‘hash’ 模式,再进行打包 ‘npm run generate’ 文件:nuxt.conf
vue项目设置打包后的静态文件访问路径
start_sea的博客
08-31 1万+
*啰嗦一下:**相同域名下可能会存在两份相关或不相关的代码,需要通过切换文件路径进入不同项目时,需要在项目打包输出代码时设置静态文件的访问路径vue、react都要)。**静态文件访问路径说明:**项目静态文件访问路径在本地运行和服务器访问是有区别的,默认状态下服务器上的项目代码,访问路径是从服务器根目录开始。vue项目的最终项目文件需要经过打包输出,静态文件的访问路径需要在vue.config.js文件中设置。**H5中的访问设置:**在H5中,静态文件访问路径的区别。...
vue修改打包静态资源路径修改
weixin_42467515的博客
03-05 428
vue修改打包静态资源路径修改
干货满满,解决vue打包静态资源路径错误的问题,3个月学会前端开发
最新发布
2401_83739434的博客
04-08 406
2.保证资源转码条件符合。这块主要涉及到加载用到的加载器url-loader, 需要保证其配置可执行。打开build目录下的webpack.base.conf.js看代码:.*)?$/,options: {limit: 10000, // 该限制为小于10KB的图片,系统默认转码为base64},
vue修改打包静态资源路径
weixin_34110749的博客
12-15 1345
使用vue-cli生成的项目打包方式是直接执行package.json里配置的脚本 npm run build // 这步其实是去执行build下的build.js脚本文件 node build/build.js 复制代码如果发布到服务器资源,该静态资源路径都是默认在根路径下,大多数情况下是不符合期望的,还是希望放在指定位置。 这里只需要修改config文件夹下的生产环境配置文件pro...
vue cli 3.x打包修改生成的静态资源的目录和路径
小豆的博客
04-12 1万+
vue cli 2.x版本修改目录和路径,都在'/config/index'文件修改。 但是vue cli升级成3.x发现这些文件都不见啦,就一个'vue.config.js'文件,我们可以在这里修改: `module.exports = { // 没有书写outputDir属性 默认'dist' 对应dev.assetsSubDirectory. outputDir: ...
vue3+vite打包配置,绝对路径改相对路径,更改静态资源目录
vayne_1的博客
05-26 1万+
vue3+vite打包配置,绝对路径改相对路径,更改静态资源目录
记一次 Vue CLI 项目修改打包资源输出目录
Cyj1414589221的博客
01-04 3495
某天同事在上架浙政钉应用的时候碰到个问题,Vue 项目打包默认输出资源路径的目录结构不符合上架要求...
vue-element-admin实现build打包文件下改变每个静态资源路径
vvv3171071的博客
10-28 2703
组长两句话说明的需求,其实也简单,就改一行代码。 打开vue.config.js,找到assetsDir,默认输出路径是’static’,改成你想要将静态资源输出到的路径就可以了。我改成了’home/static’ // assetsDir: 'static', assetsDir: 'home/static', 然后打包后的dist里的静态资源就放到了dist/home/static目录下 题外话:这样做好像是利于Nginx的部署啥的,等这几天忙完项目后好好请教一下原理吧,太菜了,还得更加努
vue 项目vue.config所有配置详解
weixin_39273589的博客
08-26 3995
publicPath配置项用于指定构建打包后的静态资源路径,默认值为'/'。在部署到服务器时,如果项目静态资源(如CSS、JavaScript、图片等)的路径不是根路径,可以通过设置publicPath来指定正确的路径。assetsDir配置项用于指定静态资源(如CSS、JavaScript、图片等)的目录,默认值为空字符串'',表示静态资源将会输出在outputDir根目录中。在Vue项目中,可以使用vue.config.js文件来配置一些Vue项目的构建和开发配置。
vue 打包后 static 中图片路径不对的问题
热门推荐
热爱思考、活力满满、开朗爱笑的年轻人
12-10 2万+
vue 打包后 static 中图片路径不对的问题 在做这个 vue-cms 项目时,npm build 打包部署后,然后访问的时候,发现:图片不能正常的显示(包括背景图,logo 之类的),请求的路径都 404 了,明显不对。 ...
vue打包静态资源后显示空白及static文件路径报错的解决
11-19
今天使用vue打包(npm run build)遇到了几个坑,在这里分享给大家 打包之后打开dist的页面显示空白: 这个问题以前就处理过,是打包过程中出现错误频率较高的一种,可能有3处地方会出现这种情况 1、记得改一下...
vue和webpack打包项目相对路径修改的方法
01-19
一般vue使用webpack打包是整个工程的根目录,但是很多情况下都是把vue打包后的文件在某子目录下。 修改: 1,打开index.js assetsPublicPath:'/' 改为: assetsPublicPath: './' 2.解决css里面的路径问题,打开...
解决vue单页面应用打包后相对路径、绝对路径相关问题
11-20
所以,如果在项目中需要使用相对路径来获取静态的资源文件,需要怎么做呢? 1、修改webpack配置文件中的assetsPublicPath,修改为如下图所示。 修改配置后,进行打包发现,打包后的index.html文件中,对css等文件的...
解决vue项目打包后提示图片文件路径错误的问题
12-12
这是为什么呢,以前第一次使用vue-cli构建项目的的时候只有两个图片文件,当时部署后报错路径问题, 当时的想法就是简单粗暴,直接在build好的文件修改文件路径,再后来项目中遇到了一大堆静态资源修改路径显然...
关于VUE打包后index.html文件中的静态资源路径配置
Angela
09-20 1万+
问题: vue 使用 npm 命令:npm run build 打包后生成dist文件夹,其中的index.html文件引用的静态资源:css文件和js文件没有引号,如图: 解决: 修改配置文件:build文件夹下的webpack.prod.conf.js文件,将removeAttributeQuotes: true修改为false, removeAttributeQuotes: false 如...
关于Vue项目打包时,资料路径需要切换至相对路径的问题
engineer_why的博客
10-15 2003
在网站的访问中,如果静态资源使用了绝对路径,那么它始终以当前网站作为访问的根节点。就是绝对错不了的路径,始终以一个固定的目录作为起点。容易错,可以是任意一个目录节点作为起点。
Vue工程打包部署Tomcat,解决404、静态路径等问题
Young-weiai
04-20 2816
通常使用nginx部署会少很多麻烦,但是部署环境通常也不是开发程序员能够决定的。Vue部署Tomcat所遇到的静态文件问题、刷新问题通过以上配置修改,基本都能解决。解决不了的,欢迎留言讨论~
vue项目打包之后静态资源无法显示
03-31
可能是因为打包后的静态资源路径修改了,需要修改配置文件中的静态资源路径。 1. 确认打包后的静态资源路径打包后生成的 dist 目录下查看静态资源路径,如图片、CSS、JS 等文件路径是否正确。 2. 修改静态资源路径Vue 项目中,静态资源路径一般是通过配置文件中的 publicPath 来设置的。打开配置文件 vue.config.js,将 publicPath 设置为 './'。 ``` module.exports = { publicPath: './' } ``` 如果静态资源存放在自己的服务器上,可以将 publicPath 设置为服务器的地址。 3. 重新打包项目 修改配置文件后,重新运行打包命令,将打包后的文件上传到服务器即可。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
34
原创
24
点赞
120
收藏
19
粉丝
关注
私信
写文章

热门文章

  • 微信小程序充值功能 9909
  • js将数组分割成多个数组 3791
  • 微信小程序日历签到功能 3782
  • vue封装请求方法 3549
  • uni-app解决并发请求 2253

分类专栏

  • javasript 18篇
  • vue 7篇
  • uni-app 3篇
  • css 3篇
  • 小程序 12篇

最新评论

  • 微信小程序日历签到功能

    叁拾伍: 这个.js文件怎么用啊

  • 微信小程序日历签到功能

    小波1024: 大佬,这个代码有完整的么,这边看到一半就没了

  • 微信小程序下载并打开附件

    ctotalk: 加油,不错。

  • 微信小程序日历签到功能

    若我君临天下: 这个文件跟签到功能并不牵扯,如果需要的话 Q752514677,备注然后发你

  • 微信小程序日历签到功能

    别凶小晗.: 求import $ from '../../utils/fun.js' 源码

您愿意向朋友推荐“博客详情页”吗?

  • 强烈不推荐
  • 不推荐
  • 一般般
  • 推荐
  • 强烈推荐
提交

最新文章

  • vue封装请求方法
  • vue封装常用工具函数
  • vue封装常用过滤器
2021年8篇
2020年24篇
2019年2篇

目录

目录

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值

深圳SEO优化公司莱芜网站推广工具价格西安关键词排名包年推广哪家好锦州企业网站设计岳阳SEO按天收费价格和县网站优化推广价格南通SEO按天扣费报价宿迁网站推广推荐酒泉百姓网标王价格塘坑网站搜索优化公司鸡西网站改版推荐巢湖网站优化推广推荐延边百姓网标王报价邵阳seo网站优化多少钱无锡网站改版推荐丽水优秀网站设计价格梅州高端网站设计报价玉溪网页制作哪家好铜陵关键词按天扣费报价淮北百度seo推荐商洛优化公司吕梁如何制作网站报价遵义高端网站设计哪家好白山外贸网站建设红河模板网站建设推荐海南百度网站优化排名价格马鞍山网站优化价格海西企业网站设计公司同乐百姓网标王价格泰安网站推广工具公司泰州网站建设歼20紧急升空逼退外机英媒称团队夜以继日筹划王妃复出草木蔓发 春山在望成都发生巨响 当地回应60岁老人炒菠菜未焯水致肾病恶化男子涉嫌走私被判11年却一天牢没坐劳斯莱斯右转逼停直行车网传落水者说“没让你救”系谣言广东通报13岁男孩性侵女童不予立案贵州小伙回应在美国卖三蹦子火了淀粉肠小王子日销售额涨超10倍有个姐真把千机伞做出来了近3万元金手镯仅含足金十克呼北高速交通事故已致14人死亡杨洋拄拐现身医院国产伟哥去年销售近13亿男子给前妻转账 现任妻子起诉要回新基金只募集到26元还是员工自购男孩疑遭霸凌 家长讨说法被踢出群充个话费竟沦为间接洗钱工具新的一天从800个哈欠开始单亲妈妈陷入热恋 14岁儿子报警#春分立蛋大挑战#中国投资客涌入日本东京买房两大学生合买彩票中奖一人不认账新加坡主帅:唯一目标击败中国队月嫂回应掌掴婴儿是在赶虫子19岁小伙救下5人后溺亡 多方发声清明节放假3天调休1天张家界的山上“长”满了韩国人?开封王婆为何火了主播靠辱骂母亲走红被批捕封号代拍被何赛飞拿着魔杖追着打阿根廷将发行1万与2万面值的纸币库克现身上海为江西彩礼“减负”的“试婚人”因自嘲式简历走红的教授更新简介殡仪馆花卉高于市场价3倍还重复用网友称在豆瓣酱里吃出老鼠头315晚会后胖东来又人满为患了网友建议重庆地铁不准乘客携带菜筐特朗普谈“凯特王妃P图照”罗斯否认插足凯特王妃婚姻青海通报栏杆断裂小学生跌落住进ICU恒大被罚41.75亿到底怎么缴湖南一县政协主席疑涉刑案被控制茶百道就改标签日期致歉王树国3次鞠躬告别西交大师生张立群任西安交通大学校长杨倩无缘巴黎奥运

深圳SEO优化公司 XML地图 TXT地图 虚拟主机 SEO 网站制作 网站优化