我使用nuxt框架开发过两个项目了，总结一些很简单但是踩过的坑。
1. 源代码显示页面写法
用这个框架就是为了显示网页源代码做seo，简单百度了一下没仔细撸官网，知道了asyncData中return数据就行了，刚拿到这个框架简单搭建了项目以后就开始无脑切图了，然后就留下了坑，因为一般开发页面的时候习惯拆分组件，但是一个整个页面想显示源代码，那就不能拆组件，因为asyncData方法会在组件（限于页面组件）每次加载之前被调用。
我们是先切完页面以后联调时才发现整个问题的，emm就挺蛋疼的.难能怪谁呢害。
- 正确做法：一个页面要一直写下来，不要拆分组件！
2.源代码显示中的接口调用问题
网上搜到的接口调用的写法是这样的
async asyncData({ app }){
const res1 = await 接口1;
const res2 = await 接口2;
return{
tabList1: res1.data,
tabList2: res2.data,
}
},
这样写有两个问题
- 没有try catch一个接口报错的话，整个页面都是一个灰色的error page
- await顺序调用接口会导致页面渲染的慢
- 正确做法：promise.all去请求并发全部接口 依次赋值，然后整体try catch，在页面接口多的页面渲染表现非常明显，比如我们首页的接口比较多，这样做完以后从原来的七八秒变成了两三秒
async asyncData({ app }){
try {
const res1 = 接口1;
const res2 = 接口2;
const pagePromise = await Promise.all([res1,res2]);
return{
tabList1: pagePromise[0].data,
tabList2: pagePromise[1].data
}
}catch{
return new Error('页面1渲染报错')
}
},
3.控制台的重复渲染报错
这个会在控制台有一个dom的报错，强迫症患者很难受，关于这个报错有人指出是引入插件以后重复渲染导致的，需在config中设置插件ssr：false，但我碰到的时候是因为一些不规则的标签嵌套导致的，这个就具体问题具体分析吧，我碰到的时候的解决方案是仔细检查标签嵌套，最笨的方法全用div span i这种标签，不要瞎嵌套
4.打包部署项目的时候无法请求接口
这个问题比较简单，是因为发版的时候忘记修改配置公共路径了，检查一下封装的axios里面的baseUrl就好
5.内存泄漏
话说这是我第一次碰到内存溢出的问题，我也蒙了，这个问题不会及时显现出来，而是在正常发版几天以后，项目突然就挂了，我在项目中装检查内存的插件一顿排查也没发现问题，后来git回滚代码到出问题的前一个版本，然后比较修改了那些地方，我这里是因为vuex中一个不规范的写法，导致的内存泄漏。就这问题排查了整整两天。
6.静态化部署generate
generate部署项目我也有使用过，也碰到过一些坑，比如动态传参的页面使用动态路由等等，按照官网说的一步一步做就能完成开发，就不多说了，毕竟静态打包一般项目不做大需求的改动，我也是半年前用过一次在就没动过了，如果有小伙伴碰到静态化部署项目的问题可以评论下来一起分析问题，我很喜欢帮别人解决一下奇怪的bug哈哈
