Nuxt.js工作流

image.png

Nuxt.js目录

image.png

路由&示例

新建好即等于配置好

页面模版&示例

模版是layouts

异步数据&示例&SSR原理

原理:通过下发一个script标签，在winodw下挂载了一个NUXT对象，第一个给你的是挂载的模版，第二个是数据。在服务器的时候就已经渲染完成，而不是到了浏览器再去获取数据，这就是SSR

Vuex应用&示例

官网介绍:Nuxt.js会尝试找到应用根目录下的store目录
也是SSR渲染，原理和上面的一样 下发一个script标签一起挂载进去

总结

1，第一个写页面要放在components中
2，静态资源文件放在assets中
3，想把一些页面结构复用就用layouts模版
4，想创建路由就用好pages目录
5，想管理好状态就用store目录
6，想用SSR在page这块用async asyncData(){逻辑}