From 1c54aa907e0ce00940c053885b29521311cbd930 Mon Sep 17 00:00:00 2001
From: chencheng <sorrycc@gmail.com>
Date: Tue, 27 Feb 2018 16:24:07 +0800
Subject: [PATCH] doc: add intro for 404 page

---
 docs/add-404-page.md                             | 16 ++++++++++++++++
 docs/app-structure.md                            |  5 +++--
 website/i18n/en.json                             |  1 +
 website/sidebars.json                            |  1 +
 website/translated_docs/zh-Hans/add-404-page.md  | 16 ++++++++++++++++
 website/translated_docs/zh-Hans/app-structure.md |  5 +++--
 6 files changed, 40 insertions(+), 4 deletions(-)
 create mode 100644 docs/add-404-page.md
 create mode 100644 website/translated_docs/zh-Hans/add-404-page.md

diff --git a/docs/add-404-page.md b/docs/add-404-page.md
new file mode 100644
index 000000000000..43773d360be4
--- /dev/null
+++ b/docs/add-404-page.md
@@ -0,0 +1,16 @@
+---
+id: add-404-page
+title: 添加 404 页面
+---
+
+umi 中约定 pages 目录下的 404.js 为 404 页面，这个文件需要返回 React 组件。比如：
+
+```js
+export default () => {
+  return (
+    <div>404 page</div>
+  );
+};
+```
+
+开发模式下，umi 会添加一个默认的 404 页面，但你仍然可通过精确地访问 `/404` 来验证 404 页面。
diff --git a/docs/app-structure.md b/docs/app-structure.md
index 8f020e29e010..20e841c8fba4 100644
--- a/docs/app-structure.md
+++ b/docs/app-structure.md
@@ -15,8 +15,9 @@ title: 目录结构
         ├── .umi/                  // dev 临时目录，需添加到 .gitignore
         ├── .umi-production/       // build 临时目录，会自动删除
         ├── document.ejs           // HTML 模板
-        ├── list.js                // 页面 1
-        └── index.js               // 页面 2
+        ├── 404.js                 // 404 页面
+        ├── page1.js               // 页面 1，任意命名
+        └── page2.js               // 页面 2，任意命名
     ├── global.css                 // 约定的全局样式文件，自动引入，也可以用 global.less
     ├── _routes.json               // 路由配置，和文件路由二选一
 ├── test/                          // 测试用例放这里
diff --git a/website/i18n/en.json b/website/i18n/en.json
index d91b190fcb8f..70ecc07dfa24 100644
--- a/website/i18n/en.json
+++ b/website/i18n/en.json
@@ -4,6 +4,7 @@
     "next": "Next",
     "previous": "Previous",
     "tagline": "Blazing-fast next.js-like framework for React apps.",
+    "add-404-page": "添加 404 页面",
     "api": "API",
     "app-structure": "目录结构",
     "cli": "命令行",
diff --git a/website/sidebars.json b/website/sidebars.json
index e6b769de6ed9..115e2ab526d4 100644
--- a/website/sidebars.json
+++ b/website/sidebars.json
@@ -12,6 +12,7 @@
     ],
     "Guides": [
       "router",
+      "add-404-page",
       "html-tpl",
       "load-on-demand",
       "pwa",
diff --git a/website/translated_docs/zh-Hans/add-404-page.md b/website/translated_docs/zh-Hans/add-404-page.md
new file mode 100644
index 000000000000..43773d360be4
--- /dev/null
+++ b/website/translated_docs/zh-Hans/add-404-page.md
@@ -0,0 +1,16 @@
+---
+id: add-404-page
+title: 添加 404 页面
+---
+
+umi 中约定 pages 目录下的 404.js 为 404 页面，这个文件需要返回 React 组件。比如：
+
+```js
+export default () => {
+  return (
+    <div>404 page</div>
+  );
+};
+```
+
+开发模式下，umi 会添加一个默认的 404 页面，但你仍然可通过精确地访问 `/404` 来验证 404 页面。
diff --git a/website/translated_docs/zh-Hans/app-structure.md b/website/translated_docs/zh-Hans/app-structure.md
index 8f020e29e010..20e841c8fba4 100644
--- a/website/translated_docs/zh-Hans/app-structure.md
+++ b/website/translated_docs/zh-Hans/app-structure.md
@@ -15,8 +15,9 @@ title: 目录结构
         ├── .umi/                  // dev 临时目录，需添加到 .gitignore
         ├── .umi-production/       // build 临时目录，会自动删除
         ├── document.ejs           // HTML 模板
-        ├── list.js                // 页面 1
-        └── index.js               // 页面 2
+        ├── 404.js                 // 404 页面
+        ├── page1.js               // 页面 1，任意命名
+        └── page2.js               // 页面 2，任意命名
     ├── global.css                 // 约定的全局样式文件，自动引入，也可以用 global.less
     ├── _routes.json               // 路由配置，和文件路由二选一
 ├── test/                          // 测试用例放这里