如果目标设置为“static”,Nuxt.js路由中间件问题

3

目标:' static '和路由器中间件。

您好,我们有一个构建在nuxt v2.4.0上的应用程序,它使用模式:' universal '。 在迁移到nuxt 2.14.0之后,应用程序仍然正常工作。 但是,在执行“yarn generate”命令期间会出现警告:

mode option is deprecated. You can safely remove it from nuxt.config

nuxt.config.js 文件中的 'router' 部分是:

  router: {
    trailingSlash : true,
    middleware: 'noroute'
  },

还有中间件/noroute.js文件:

import consola from 'consola'
export default function ({ redirect, route }) {
  consola.log('consola welcomes you')
    if (!route.name) {
      return redirect(302, "/not-found/")
    }
}

构建该应用程序使用以下命令:

$yarn generate && yarn start

应用程序完美启动,并且其行为符合预期。

yarn run v1.22.10
$ nuxt start

 WARN  mode option is deprecated. You can safely remove it from nuxt.config


   ╭───────────────────────────────────────╮
   │                                       │
   │   Nuxt @ v2.14.12                     │
   │                                       │
   │   ▸ Environment: production           │
   │   ▸ Rendering:   server-side          │
   │   ▸ Target:      static               │
   │                                       │
   │   Listening: http://localhost:3000/   │
   │                                       │
   ╰───────────────────────────────────────╯

ℹ Serving static application from dist/     

当我尝试向不存在的页面发送HTTP GET请求时,服务器的响应是完美的:

$ curl -I http://localhost:3000/page-that-does-not-exist
HTTP/1.1 302 Found
Location: /not-found/
Date: Fri, 22 Jan 2021 11:00:18 GMT
Connection: keep-alive

目前为止还不错。 现在我正在尝试通过在nuxt.config.js中添加target: 'static'来消除在nuxt generate调用时出现的烦人警告信息:

export default {
  mode: 'universal',
  target: 'static',
  //ssr: true,
  
  router: {
    trailingSlash : true,
    middleware: 'noroute'
  },
  ...

yarn generate && yarn start:

$ nuxt start

 WARN  mode option is deprecated. You can safely remove it from nuxt.config                                                                                                                            13:09:25


   ╭───────────────────────────────────────╮
   │                                       │
   │   Nuxt @ v2.14.12                     │
   │                                       │
   │   ▸ Environment: production           │
   │   ▸ Rendering:   server-side          │
   │   ▸ Target:      static               │
   │                                       │
   │   Listening: http://localhost:3000/   │
   │                                       │
   ╰───────────────────────────────────────╯

ℹ Serving static application from dist/  

但现在Curl返回HTTP状态200:

$ curl -I http://localhost:3000/page-that-does-not-exist
HTTP/1.1 200 OK
Content-Type: text/html
Date: Fri, 22 Jan 2021 11:10:21 GMT
Connection: keep-alive

看起来路由流程最近已经改变。

根据文章提供的信息,mode: 'universal'选项是两个选项target: 'static'和ssr: true的等效值(ssr:true默认设置,因此可以省略)。然而,它却不能这样工作。

还有另一篇关于在Netlify上进行静态模式部署的文章

我的问题是:Nuxt.js v2.14.0 的正确配置是什么,以完全匹配先前版本中的 universal mode,或者说,更好的问题是:如何正确使用 target: static 来使路由中间件正常工作。

感激任何帮助我解决问题的信息。

提前致谢。


1
我有类似的问题,这个有解决方案吗? - Tharindu Prabodhana
1个回答

0

mode: 'universal' 相当于 target: 'server',这是现在的默认设置。

这意味着如果您想要实现服务器端渲染,可以安全地从您的 nuxt.config.js 中删除 modetargetssr 选项。

更多信息请参见:


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接