安装

安装它:

  1. npm install --save next react react-dom

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

  1. {
  2. "scripts": {
  3. "dev": "next",
  4. "build": "next build",
  5. "start": "next start"
  6. }
  7. }

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

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

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

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

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

  • 自动打包编译 (使用 webpack 和 babel)
  • 热加载
  • 以 ./pages作为服务端的渲染和索引
  • Static file serving. ./static/ is mapped to /static/ (given you create a ./static/ directory inside your project)
  • 静态文件服务. ./static/ 映射到 /static/ (可以 创建一个静态目录 在你的项目中)
    这里有个简单的案例,可以下载看看 sample app - nextgram