next.js初入门
为什么要用next,js
最近公司有一个项目突然来了个需求,客户想要能在百度和谷歌这类搜索引擎搜到活动的子页面,但是这个项目一开始开发的时候用了react框架,也就是一直都是spa,这对于seo是很难优化的,没办法,只能重新找个方法来进行开发。我也很烦恼,刚接手就碰到了这个大问题,最后找了下,发现了一个名叫next.js的框架,能够实现react的服务端渲染,我也不多想了,直接投入到next.js的学习中去,开冲!
创建 Next.js 应用程序
这个很简单,参考文档直接npm安装就可以了
npm install --save next react react-dom
将下面脚本添加到 package.json 中:
{
"scripts": {
"dev": "next",
"build": "next build && next export",
"start": "next start"
}
}
是否需要export看自己的需求,我是需要导出静态页面所以用了export
创建第一个页面
在page目录下直接新建一个index.js并输入一些奇怪的代码
import Link from 'next/link'
import Head from 'next/head'
export default () =>
<div>
<Head>
<title>Index</title>
</Head>
Click{
' '}
<Link href=