目 录 致谢 来源 安装 代码自动分割 CSS 静态文件服务（如图像） 生成 获取数据以及组件生命周期 路由 预加载页面 自定义服务端路由 动态导入 自定义 自定义 自定义错误处理 渲染内置错误页面 自定义配置 自定义 webpack 配置 自定义 babel 配置 暴露配置到服务端和客户端 启动服务选择 hostname CDN 支持前缀 项目部署 浏览器支持 导出静态页面 多 zone 技巧 问答 贡献 作者 本文档使用 书栈(BookStack.CN) 构建 - 2 - 致谢 致谢 当前文档 《next.js 中文文档》 由 进击的皇虫 使用 书栈(BookStack.CN) 进行构建，生 成于 2018-09-06。 书栈(BookStack.CN) 仅提供文档编写、整理、归类等功能，以及对文档内容的生成和导出工 具。 文档内容由网友们编写和整理，书栈(BookStack.CN) 难以确认文档内容知识点是否错漏。如果 您在阅读文档获取知识的时候，发现文档内容有不恰当的地方，请向我们反馈，让我们共同携手，将知 识准确、高效且有效地传递给每一个人。 同时，如果您在日常工作、生活和学习中遇到有价值有营养的知识文档，欢迎分享到 书栈 (BookStack.CN) ，为知识的传承献上您的一份力量！ 如果当前文档生成时间太久，请到 书栈(BookStack.CN) 获取最新的文档，以跟上知识更新换 代的步伐。 文档地址：http://www.bookstack.cn/books/next.js-zh 书栈官网：http://www.bookstack.cn 书栈开源：https://github.com/TruthHun 分享，让知识传承更久远！ 感谢知识的创造者，感谢知识的分享者，也感谢每一位阅读到此处的 读者，因为我们都将成为知识的传承者。 本文档使用 书栈(BookStack.CN) 构建 - 3 - 来源 来源 Next.js 是一个轻量级的 React 服务端渲染应用框架。 来源：https://github.com/raoenhui/next-site-cn/blob/master/Introduction.md 本文档使用 书栈(BookStack.CN) 构建 - 4 - 安装 安装 安装 安装它: 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. 每个 新建 ./pages/index.js .js 文件将变成一个路由，自动处理和渲染。 到你的项目中: 1. export default () => <div>Welcome to next.js!</div> 运行 npm run dev dev — -p <设置端口号> 命令并打开 http://localhost:3000 。 如果你想使用其他端口，可运行 npm run . 目前为止我们可以了解到: 自动打包编译 (使用 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 本文档使用 书栈(BookStack.CN) 构建 - 5 -