https://zh.nuxtjs.org/docs/2.x/concepts/nuxt-lifecycle
https://ssr.vuejs.org/guide/universal.html#component-lifecycle-hooks

生命周期

由于没有动态更新所有的生命周期挂钩的，只有beforeCreate和created将SSR中被调用。这意味着其他生命周期钩子中的任何代码，例如beforeMount或mounted只会在客户端上执行。

server

对于 SSR，将对您的应用程序的每个初始请求执行这些步骤

  1. The server starts (nuxt start)
  2. The generation process starts (nuxt generate)
  3. Nuxt hooks
  4. serverMiddleware
  5. Server-side Nuxt plugins
    1. in order as defined in nuxt.config.js
  6. nuxtServerInit
    1. 只能定义在 store/index.js
  7. Middleware
    1. Global middleware
    2. Layout middleware
    3. Route middleware
  8. asyncData
  9. beforeCreate
  10. created
  11. The new fetch (top to bottom, siblings = parallel)
  12. Serialization of state (render:routeContext Nuxt.js hook)
  13. the HTML rendering happens (render:route Nuxt.js hook)
  14. render:routeDone hook when HTML has been sent to the browser
  15. generate:before Nuxt.js hook
  16. HTML files are generated
    1. Full static generation
      1. e.g. static payloads are extracted
    2. generate:page (HTML editable)
    3. generate:routeCreated (Route generated)
  17. generate:done when all HTML files have been generated


client

  1. Receives the HTML
  2. Loading assets (e.g. JavaScript)
  3. Vue Hydration
  4. Middleware
    1. Global middleware
    2. Layout middleware
    3. Route middleware
  5. client-side Nuxt.js plugin
    1. in order as defined in nuxt.config.js
  6. asyncData (blocking)
  7. beforeCreate (Vue lifecycle method)
  8. created (Vue lifecycle method)
  9. The new fetch (top to bottom, siblings = parallel) (non-blocking)
  10. beforeMount (Vue lifecycle method)
  11. mounted (Vue lifecycle method)