next.js是基于react实现的服务端渲染，为单页面实现良好的seo带来了福音；初次采坑next.js;
1.next.js+antd实现滚动到相应的位置动态的添加class名来实现动画效果，但是在开阶段完全没有问题，npm run build打包之后无法实现滚动效果；
解决方案：找不到原因之前，我怎么猜也猜不到是css的原因，npm run build打包后看打包后的文件，发现打包过程会将css进行合并，这其中就有antd的样式，html，body{width:100%;height:100%;}把height：100%；干掉就完全没有问题；
2.如何实现移动端等比缩放？
next.js设置了Head组件，可以重置我们的页面头，重新重置meta就能实现，也可以在这里添加title，引入外部的css，js，例如我项目中的一个部分；
export default function Index() {
return (
<div className='page' data-name='index'>
<Head>
<meta name="viewport" content="" />
<title>首页</title>
<link href='/favicon.ico' />
<link rel="stylesheet" href='../static/libs/swiper/dist/css/swiper.min.css' />
<script src='../static/js/index.js'></script>
</Head>
<Header></Header>
<Home></Home>
<Footer></Footer>
</div>
);
}3.无法实现自定义打包设置，在发版之前必须的步骤 npm run build 之后是 npm start
如果不执行npm start 页面加载会出现问题：1.页面加载非常慢，2：页面样式会出现凌乱，重新刷新又变正常；
原因是npm start 里面还封装也相关方法，实现的原理跟过程还没有时间看，敬请期待
4.ios上hover的效果在线上第一次进来不起作用，
在安卓上完全没有问题，在本地也完全没有问题，但是发到线上就不起作用解决方法
document.body.addEventListener('touchstart',function(){});或者
<body ontouchstart>
扫一扫
1168
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
