vue build后。静态资源的404问题探究，解决

最新推荐文章于 2024-08-29 10:56:15 发布

weixin_34072637

最新推荐文章于 2024-08-29 10:56:15 发布

阅读量2.8k

点赞数 1

文章标签： javascript python 前端 ViewUI

原文链接：https://my.oschina.net/u/222749/blog/2252471

版权

2019独角兽企业重金招聘Python工程师标准>>>

vue-cli升级到3.0，build项目后，传到服务器，页面显示空白

具体原因是静态资源的路径跟服务器的不匹配

修改方法，打开文件：vue.config.js，加入下面内容

baseUrl: '/pet-mgr/' ,

将dist文件夹上传到服务器的根目录后，将dist文件夹重命名为pet-mgr就可以了

转载于:https://my.oschina.net/u/222749/blog/2252471

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_34072637

关注关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

vue - 源码探究 vue-cli 2 中 '/static'目录和 '/src/assert'目录区别

LawssssCat的博客

03-06

1444

vue-cli 官方对 - 静态资源的介绍这里 vue cli 3 里面也大同小异，3 只是把 static 改成了 public 文章目录# 指定 - 输出目录： /dist# 指定 - 静态资源文件名：static# 拷贝 - /static目录到 /dist/static目录结论：关于 /static 目录# 指定：编译后的名字（或者目录）# url-loadder 的 ...

探究SEO与VUE首屏渲染及其解决方案

weixin_56659504的博客

04-09

416

五个方面 1.SPA单页面应用首屏打开速度很慢，因为用户首次加载需要先下载SPA框架及应用程序的代码，然后再渲染页面。不利于SEO 根据这几个缺点，我们便又引出了接下来讨论的两个主题，SEO和SSR，先谈谈SEO。 2. SEO搜索引擎搜索引擎优化。SEO是一种通过了解搜索引擎的运作规则（如何抓取网站页面，如何索引以及如何根据特定的关键字展现搜索结果排序等）来调整网站，以提高该网站在搜索引擎中某些关键词的搜索结果排名。 Vue SSR说：如果你的应用程序初始展示 loading 菊

参与评论您还未登录，请先登录后发表或查看评论

vue路由history模式刷新页面出现404问题

ctf_0226的博客

12-03

335

vue hash模式下，URL中存在'#'，用'history'模式就能解决这个问题。但是history模式会出现刷新页面后，页面出现404。解决的办法是用nginx配置一下。在nginx的配置文件中修改方法一： location /{ root /data/nginx/html; index index.html index.htm; if (!-e $r...

解决webpack vue 项目打包生成的文件，资源文件均404问题

aiyaya2016的博客

01-08

445

　　最近在使用webpack + vue做个人娱乐项目时，发现npm run build后，css js img静态资源文件均找不到路径，报404错误。。。网上查找了一堆解决办法，总结如下一、首先修改config目录下的index.js文件将其中build的配置项assetsPublicPath进行修改，改为目的是将资源文件的引入路径，改为相对地址（相对inde...

nginx 解决vue打包后显示404静态图片无法显示的问题

最新发布

初遇你时动了情

08-29

227

【代码】nginx 解决vue打包后显示404静态图片无法显示的问题。

vue项目通过nginx部署，刷新产生404问题的解决

m0_37630138的博客

10-08

4860

vue项目通过nginx部署，刷新产生404问题的解决

Vue DOM挂载

小王的技术库

06-17

1601

接下来我们就来探究是如何将该页面进行渲染的。在研究之前，我们必须了解构造函数。但是在执行函数前，当我们的时候，该框架做了这样的几个初始化：其实上面的函数是在我们导入时，该框架本身做的一些初始化，这和我们执行构造函数时内部的初始化不一样。这些函数主要是在我们使用前，向构造函数的原型上添加一些函数。而当我们执行构造函数时，也会在内部进行一些初始化，例如响应式的完成和数据代理。所以我们需要区分这两种初始化。然后我们就可以执行构造函数了。当我们执行构造函数的时候，本质上其实就是执行方法。这个是在函数中声明的。函

三大主流框架React、Angular、Vue

lin123_00的博客

06-27

4148

【引言】 web前端开发当前世界中，技术发展非常迅速并且变化迅速，开发者需要更多的开发工具来解决不同的问题。本文就对于当下主流的前端开发技术React、Vue、Angular这三个框架做个相对详尽的探究。【React】 React（也被称为React.js或ReactJS）是一个用于构建用户界面的JavaScript库。它由Facebook和一个由个人开发者和公司组成的社区来维护。 React可以作为开发单页或移动应用的基础。然而，React只关注向DOM渲染数据，因此创建React应用通常需

核心框架：SpringBoot/Vue.js

qq_17295025的博客

11-17

800

SpringBoot 微服务阶段 JavaSE：OOP Mysql：持久化 html+css+js+jquery+框架：视图，框架不熟练，css javaweb：独立开发MVC三层架构的网站：原始 ssm：框架：简化了我们的开发流程，配置也开始比较复杂 war：tomcat运行 Spring再简化：SpringBoot-jar：内嵌tomcat；微服务架构服务越来越多：SpringCloud管理 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FfzI5I76-1605599

前端加载404(Not Found)问题常用的解决方法

04-19

1万+

前端404问题是指在页面中访问不存在的资源时出现的页面404错误

部署到服务器上访问404的解决办法

qq_61781758的博客

05-12

2019

我本机ping虚拟机ping不通，我觉得应该是这个的原因，但是我自己的问题还是没解决，发出来给大家做个参考吧。publicPath: './', //这个必须，引入静态资源需要从根路径引入，否则会找不到静态资源。assetsDir: '', //静态资源目录（js, css, img）8.用本机ping虚拟机，或者用虚拟机ping本机看能不能ping通。outputDir: 'dist', //build输出目录。具体效果是在找不到页面的情况下，自动跳转到index.html。7.看防火墙关没关。

vue+ elementUI 打包发布到服务器后，element-icons.woff文件404

weixin_30315435的博客

05-16

3179

vue项目打包部署到服务器，静态资源文件404 js文件404问题　　原因：打包的项目静态资源的路径需要设置为绝对路径。如果是相对路径会出错　　　　解决办法：修改config/index.js文件，将assetsPublicPath修改为'./'　　 element-icons.woff 文件 404 ...

解决vue-cli构建的项目在build后，本地index打不开

weixin_43403746的博客

05-12

1510

时间有限，废话少说。不需要新建什么vue.config.js文件，也不需要改路由什么的，老版本可能需要，新版本根本没有vue.config.js文件，只有build和config目录，在这里做修改即可。 1.将config目录中的index.js文件中，build里面的assetsPublicPath改一下 assetsPublicPath: './', 改成前面多加一个点就可以的，记得是build对象里面。 2.在build的utils.js里面的if（options.extract）{}里加上下面这

vue项目build之后页面问题(页面空白,图片异常)

MG516的博客

06-12

1950

页面空白找到项目的config目录下的index.js 把build对象下的assetsPublicPath改成‘./’ build: { assetsPublicPath: './', } 图片记载不出来 1.针对src/style和.vue文件下的图片资源路径问题找到项目的build目录下的utils.js 找到下面代码段，新增publicPath: '../../' retur...

Vue项目build打包后如何运行

宁坡浪子的博客

10-31

9211

npm run build命令进行打包后的程序如何在本地运行 1.全局安装express-generator生成器。 npm install express-generator -g 2.创建一个express项目。 express 项目名 3.进入项目目录，安装相关项目依赖。 cd 项目名 npm install//或cnpm install 4.将Vue build后生成的dist文件夹下的所有文件复制到express项目的publick文件夹下面，然后运行npm start...

Vue.js 项目build后路径问题

_程昊的博客

08-30

3187

Vue.js 项目build后路径问题执行npm run build 后再打开index.html发现引用的css和js出现了路径找不到的问题。打开config/index.js 找到build：module.exports = { build: { env: require('./prod.env'), index: path.resolve(__

Vue 项目部署时静态资源找不到的解决方法

解决 Vue 项目中 webpack build 静态资源找不到的问题需要修改 config/index.js 文件中的 assetsPublicPath 配置项，添加项目名称的路径，并且注意 assetsPublicPath 末尾的斜杠一定要加。这样，我们就可以正确地...