安装

安装它:

npm install --save next react react-dom

将下面脚本添加到 package.json 中:

{
  "scripts": {
    "dev": "next",
    "build": "next build",
    "start": "next start"
  }
}

Next.js 只支持React 16.
由于我们使用 React 16 的特性，所以不得不放弃对 React 15 以及以下版本的支持. 当前译版为7.0.0-canary.8

下面, 文件系统是主要的 API. 每个.js 文件将变成一个路由，自动处理和渲染。

新建 ./pages/index.js 到你的项目中:

export default () => <div>Welcome to next.js!</div>

运行 npm run dev 命令并打开 http://localhost:3000。 如果你想使用其他端口，可运行 npm run dev -- -p <设置端口号>.

目前为止我们可以了解到:

• 自动打包编译 (使用 webpack 和 babel)
• 热加载
• 以 ./pages作为服务端的渲染和索引
• 静态文件服务. ./static/ 映射到 /static/ (可以 创建一个静态目录 在你的项目中)

这里有个简单的案例，可以下载看看 sample app - nextgram