使用vite打包vue项目生成dist文件夹,部署至nginx除了index.html,其他路径都提示404错误的解决

hykeda1年前Vue1943

vue打包生成dist文件夹,然后在本地nginx部署vue项目时只能访问默认页面,刷新和跳转页面都会出问题。

f341a9addb164e22aee5e4d91dae2cca.png

原因:

只访问了dist文件下的 index.html、index.htm页面,而其他页面在访问的时候被nginx当作自身的服务访问而找不到,我们修改一下配置文件。


方法:

添加上 try_files $uri $uri/ /index.html;

location / {
        try_files $uri $uri/ /index.html; # 用于支持Vue-router的history模式
    }


相关文章

vue中的h函数使用

一、参数设置h函数接收三个参数。第一个参数:,可以为一个html标签,一个组件,一个异步组件,或者是一个函数式组件。第二个参数:{ Object } Props,与attributes和props,以...

vue 中父组件要向子组件通过props传值出现延时处理方案

在开发vue是,父组件要向子组件传值,但是这个值是父组件通过接口请求的,如果直接通过<ABC :abc="data"/>这样在子组件中获取到的abc是为空,因...

vite.config.js配置@

import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import path f...

vue3中给响应式数据赋值操作,以及toRef 和 toRefs区别

最近在开发vue3时,定义了一个变量:let form = reactive({});form = res.items;这里我将接口获取到的数据直接赋给了form,这样我在表单中:<el-for...

[Vue warn]: Error in render: “TypeError: Cannot read property ‘name‘ of undefined“,报错,已解决。

含义:渲染时发生错误:类型错误:不能读取undefined的name属性原因:出现上述报错其实是因为,你访问了undefined.name,但是 undefined 没有 name,所以报错。原因有两...

vuex存储和本地存储(localstorage、sessionstorage)的区别

1. sessionStorage    sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除。   用法: ...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。