Nuxt.js : Impossible de générer automatiquement la configuration de routage

Question

Je souhaite générer des itinéraires statiques (/contact, /about,...) et des itinéraires dynamiques (/project /1< /code>, /project/2, ...) afin que lorsque l'utilisateur actualise la page en accédant à l'une de ces routes, la page fonctionne toujours correctement.

Mais lors de l'exécution de npm run generate, je n'obtiens que la route générée "/", dans /dist les itinéraires générés ne sont pas visibles dans le dossier.

Version Nuxt.js utilisée : 2.14.7

J'ai essayé les deux modes, universal et spa, aucun n'a fonctionné.

Dans le fichier nuxt.config.js, j'ai ajouté le code suivant en haut :

const axios = require('axios')

const DynamicRoutes = async () =>
  const routes = attendre axios.get('http://my-project.com/wp/wp-json/projects/v1/posts')
    .then(res => res.data.map((project) => `/project/${project.ID}/${project.post_name}`))
    .then(res => res.concat(
      [
        '/à propos de',
        '/contact',
        '/portefeuille'
      ]
    ))
  itinéraires de retour
}
≪/pré>
Puis dans export default {} : 
générer : {
  itinéraires : itinéraires dynamiques
},
≪/pré>

Answer 1

Tout d'abord, vous n'avez pas besoin d'ajouter mode: 'universal'，只需添加target: 'static'以简化配置。了解更多信息 - https://nuxtjs.org/docs/2.x/features/deployment-targets/。使用ssr: true dans la configuration, vous obtiendrez un site Web en mode complètement statique avec des hooks pertinents comme décrit dans https://stackoverflow.com/a/65208463/8153537.

Ensuite, vous pouvez supprimer le module @nuxt/router. Découvrez mon résumé - https://gist.github.com/MexsonFernandes/d04495c86b115bbe29f26b36b0b35d2d. Nuxt génère toutes les routes requises en fonction de la structure des dossiers, aucune configuration supplémentaire n'est donc requise.

Consultez cet aperçu du routage des pages du projet - https://gist.github.com/MexsonFernandes/d04495c86b115bbe29f26b36b0b35d2d#gistcomment -3555332.

Answer 2

router.mode='hash' 似乎与 generate.routes 配置不兼容。当 router.mode 设置为 hash 时，Nuxt 生成器会忽略 generate.routes，只创建一个用于 / 的路由，这可能是因为只期望在 hash 模式下存在首页（即 index.html met en place une route qui gère tout le routage pour l'application).

Ce mode de hachage est également en conflit avec le mode défini dans router.js, mais si vous avez vraiment besoin d'un routage de hachage, vous devez choisir de simplement le définir dans router.jsrouter.js 中设置它，以允许处理 generate.routes pour permettre le traitement de generate.routes

.

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

, donc ssr=false configuration

n'a aucune signification dans ce mode. Si vous générez un site statique, vous avez besoin de ssr=true pour que l'un des hooks asyncData()

et fetch()🎜 puisse être appelé pour remplir les données de la page statique. Ce paramètre élimine également le besoin de DynamicRoutes ()🎜 L'ajout de /about🎜, /contact🎜 et /portfolio🎜 est requis 🎜🎜 car ils sont déjà inclus dans l'itinéraire généré. 🎜 🎜🎜RP GitHub🎜🎜