Nuxt.js: 라우팅 구성을 자동으로 생성할 수 없습니다.

Question

정적 경로(/contact, /about,...)와 동적 경로(/project /1< /code>, /project/2, ...) 사용자가 이러한 경로 중 하나에 액세스하는 동안 페이지를 새로 고칠 때 페이지가 여전히 올바르게 작동하도록 합니다.

그러나 npm run generate를 실행할 때 /dist에서 생성된 경로 "/"만 얻습니다. 생성된 경로는 폴더에 표시되지 않습니다.

사용된 Nuxt.js 버전: 2.14.7

universal 및 spa 두 가지 모드를 모두 시도했지만 둘 다 작동하지 않았습니다.

nuxt.config.js 파일의 상단에 다음 코드를 추가했습니다.

const axios = require('axios')

const DynamicRoutes = 비동기() =>
  const 경로 = axios.get('http://my-project.com/wp/wp-json/projects/v1/posts')을 기다립니다.
    .then(res => res.data.map((프로젝트) => `/project/${project.ID}/${project.post_name}`))
    .then(res => res.concat(
      [
        '/에 대한',
        '/연락하다',
        '/포트폴리오'
      ]
    ))
  귀국 경로
}

그런 다음 export default {}에서:

생성: {
  경로: 동적 경로
},

Answer 1

먼저 구성에 mode: 'universal'，只需添加target: 'static'以简化配置。了解更多信息 - https://nuxtjs.org/docs/2.x/features/deployment-targets/。使用ssr: true를 추가할 필요가 없습니다. https://stackoverflow.com/a/65208463/8153537에 설명된 대로 관련 후크가 있는 완전히 정적 모드 웹 사이트를 얻게 됩니다.

다음으로 @nuxt/router 모듈을 제거할 수 있습니다. 내 요점을 확인하세요 - https://gist.github.com/MexsonFernandes/d04495c86b115bbe29f26b36b0b35d2d. Nuxt는 폴더 구조를 기반으로 필요한 모든 경로를 생성하므로 추가 구성이 필요하지 않습니다.

프로젝트 페이지 라우팅에 대한 요지를 확인하세요 - https://gist.github.com/MexsonFernandes/d04495c86b115bbe29f26b36b0b35d2d#gistcomment-3555332.

Answer 2

router.mode='hash' 似乎与 generate.routes 配置不兼容。当 router.mode 设置为 hash 时，Nuxt 生成器会忽略 generate.routes，只创建一个用于 / 的路由，这可能是因为只期望在 hash 模式下存在首页（即 index.html 애플리케이션의 모든 라우팅을 처리하는 경로를 설정합니다.

이 해시 모드는 router.js에 설정된 모드 와도 충돌하지만, 해시 라우팅이 꼭 필요한 경우 router.jsrouter.js 中设置它，以允许处理 generate.routes에서 설정하여 generate.routes 처리를 허용하도록 선택해야 합니다.

.

mode='universal' 等同于 ssr=true，所以 ssr=false 的配置 在这种模式下没有意义。如果生成静态站点，你需要 ssr=true，这样可以调用任何 asyncData() 和 fetch() 钩子来填充静态页面数据。这个设置还消除了在 dynamicRoutes() 中添加 /about、/contact 和 /portfolio 的需要또한 mode='universal'은 ssr=true

과 동일하므로 ssr=false 구성

은 이 모드에서는 의미가 없습니다. 정적 사이트를 생성하는 경우 asyncData() 및 fetch()

후크 중 하나를 호출하여 정적 페이지 데이터를 채울 수 있도록 ssr=true🎜가 필요합니다. 또한 이 설정을 사용하면 DynamicRoutes()🎜 /about🎜, /contact🎜 및 /portfolio🎜가 생성된 경로에 이미 포함되어 있으므로 추가가 필요합니다🎜🎜. 🎜 🎜🎜GitHub 홍보🎜🎜