一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第6天，点击查看活动详情
0 Why nuxt
nuxt的核心功能就是ssr和静态化部署。
nuxt优点：
1)利于搜索引擎优化（SEO)。
2)快，利于首屏渲染时间缩短，原因是数据请求实在服务端完成（走的是内网）。
缺点：
服务端完成一系列请求，并发高，而且需要从服务器返回整个vue实例。
部署较麻烦 （pm2 。。。）
1 与Nuxt2的差别
- 更好的性能提升（Better performance）
- 组合式api的支持
- TypeScript 支持
Nuxt3使用了vue3，vue3的性能提升都会在nuxt3中体现，因此vue3的组合api和ts支持也得以实现。 并且nuxt3默认使用了vite，也可以使用webpack5，打包工具的迭代，也带来了更强的性能提升和开发体验。
2 从Nuxt2的迁移
按照官网的说法，nuxt2转到3还是挺复杂的，毕竟涉及vue2转vue3，以及脚手架的变化。
目前本人还没有成功落地项目迁移，先记录下，之后补上。
3 Nuxt3新特性
- useAsyncData 服务端获取数据
- useLazyAsyncData 服务端异步获取数据
- useFetch 服务端请求数据
- useLazyFetch 服务端异步请求数据
- useState ref的替代方案，更倾向于nuxt2的fetch，所有组件共用
- useCookie
nuxt的asydata和fetch也支持了组合式api，可以再setup里使用。
目录增加了composables
官网说的很清楚：
在 composables 文件夹下新建`useFoo.ts`文件,编写组合逻辑代码。
import { useState } from '#app';
export const useFoo = () => {
return useState('foo', () => 'bar');
};
使用：
<template>
<div>
{{ foo }}
</div>
</template>
<script setup>
const foo = useFoo();
</script>
这样就可以在所有组件里使用state，一定程度可以替代store，但是复杂的数据结构还是要靠store来处理。
其他
中文文档介绍都较为初浅，明天还得彻底过下英文文档。
