vue下使用nginx刷新页面404的问题解决

 更新时间:2019年08月02日 14:26:07   作者:JiAyInNnNn123  
这篇文章主要介绍了vue下使用nginx刷新页面404的问题解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

nginx 是一个代理的服务器。

出现的问题:写好的页面通过nginx作为代理的服务器给别的同事看的时候发现了新写的页面打开就404,并且从其他页面跳转可以看到但是刷新页面就404。

解决方法:

在文件中的nginx.conf文件中修改,代码如下

server {
    listen    YYYY;  //自己设置的端口号
    server_name 192.168.XXX.XXX;  //在黑窗口下ipconifg后出现的IPv4地址复制
     
    location /{
      root E:/website_wap/dist/;  //项目打包后的路径
      index index.html index.htm;
      try_files $uri $uri/ /index.html;  //解决刷新页面变成404问题的代码
    } 
  }

访问的地址就是192.168.XXX.XXX:YYYY

一定要记得先npm run build 哦~(我就是在凑字数!!)

解决代码:

try_files $uri $uri/ /index.html; 

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • 详解Vue打包优化之code spliting

    详解Vue打包优化之code spliting

    这篇文章主要介绍了详解Vue打包优化之code spliting,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-04-04
  • 使用vue/cli出现defineConfig is not function错误解决办法

    使用vue/cli出现defineConfig is not function错误解决办法

    这篇文章主要给大家介绍了关于使用vue/cli出现defineConfig is not function错误的解决办法,当我们在做打包配置的时候,出现了这个错误,需要的朋友可以参考下
    2023-11-11
  • 在vue中给列表中的奇数行添加class的实现方法

    在vue中给列表中的奇数行添加class的实现方法

    今天小编就为大家分享一篇在vue中给列表中的奇数行添加class的实现方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • Vue处理循环数据流程示例精讲

    Vue处理循环数据流程示例精讲

    这篇文章主要介绍了Vue处理循环数据流程,这个又是一个编程语言, 模版语法里面必不可少的一个, 也是使用业务场景使用最多的一个环节。所以学会使用循环也是重中之重了
    2023-04-04
  • 详解Vue的键盘事件

    详解Vue的键盘事件

    这篇文章主要为大家介绍了Vue的键盘事件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2022-01-01
  • Vue如何将页面导出成PDF文件

    Vue如何将页面导出成PDF文件

    这篇文章主要为大家详细介绍了Vue如何将页面导出成PDF文件,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08
  • 详解Vue2如何监听数组的变化

    详解Vue2如何监听数组的变化

    这篇文章主要来和大家详细探讨一下Vue2中是如何监听数组的变化的,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-03-03
  • 在vue-cli脚手架中配置一个vue-router前端路由

    在vue-cli脚手架中配置一个vue-router前端路由

    这篇文章主要给大家介绍了在vue-cli脚手架中配置一个vue-router前端路由的相关资料,文中通过示例代码介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面跟着小编一起来学习学习吧。
    2017-07-07
  • Vue网页html转换PDF(最低兼容ie10)的思路详解

    Vue网页html转换PDF(最低兼容ie10)的思路详解

    这篇文章主要介绍了Vue网页html转换PDF(最低兼容ie10)的思路详解,实现此功能需要引入两个插件,需要的朋友可以参考下
    2017-08-08
  • 深入理解vue-router之keep-alive

    深入理解vue-router之keep-alive

    本篇文章主要介绍了深入理解vue-router之keep-alive。keep-alive使被包含的组件保留状态,或避免重新渲染,有兴趣的可以了解一下
    2017-08-08

最新评论