如何让 Nuxt.js 生成动态路由的静态文件

Question

Nuxt.js 提供了两种发布部署应用的方式：服务端渲染应用部署 和 静态应用部署

我选择的是第二种，执行 npm run generate 命令是可以顺利打包的，但是存在问题

-| pages/
---| index.vue
---| users/
-----| _id.vue

上述文件结构，只要有动态路由的文件是打包不出来的，_id.vue 这个文件就无法打包成功，其实官方给了如下配置

// nuxt.config.js 进行设置const axios = require('axios')module.exports = {  generate: {    routes: function () {      return axios.get('https://my-api/users')
      .then((res) => {        return res.data.map((user) => {          return '/users/' + user.id
        })
      })      
    }
  }
}

很可惜，我尝试了，但是失败了，目前项目上线，我改了代码，被迫用 /users?id=1 这样的方式，但是看起来很难受，这并不是我的初衷，如果有人遇到过此问题希望能与我在此交流

Answer 1

动态路由的文件名（即 _id ）实际上是一个变量，在 Restful 风格的路由上它是不唯一的，因此从逻辑上来说不应该打包成静态文件。即便是将这个文件的内容以某种形式打包了，那么这个 id 也需要从 query 或者 body 里查询，那么楼主的方式其实是比较合理的解决方案了。