nginx部署,nuxt静态部署,路由跳转失效的问题

本文探讨了Nuxt.js在静态部署环境下遇到的路由模式跳转失效问题,并提供了使用'hash'模式解决此问题的方法。文章详细介绍了如何在nuxt.config.js中配置路由,以确保在静态网站中路由跳转正常工作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

nuxt静态部署问题

静态部署:路由模式跳转失效的问题;不能使用历史模式,需要使用 ‘hash’ 模式,再进行打包 ‘npm run generate’

文件:nuxt.config.js

// 自定义配置路由
router: {
   mode: 'hash', // 使用 'hash' 主要是为了适配以相对路径打开的静态站点, 必须使用 'hash' 否则路由跳转不生效
   // base: '/moli/',
   base: process.env.NODE_ENV === 'production' ? './' : '/', // 使用 './' 主要是为了适配以相对路径打开的静态站点
   extendRoutes(routes, resolve) {
     routes.push({
       path: '/',
       redirect: {
         name: 'home'
       }
     })
   }
 },
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值