Next 规定我们要把应用需要的页面放在 pages 这个目录的下面 ... 先创建一个首页 .. 名字是 index.js ..

编辑器提示可以给项目安装一个 eslint ... 打开终端 .. 新建一个标签 .. 然后安装一下 eslint ..

安装好以后 .. 继续编辑 index 页面 .. 一个简单的 React 组件可以是一个普通的函数 .. 添加一个 Index .. 它是一个函数 .. 返回的东西就是组件的视图 ..

一个 div ... 包含一个段落元素 .. 文字是 hello ..

再导出定义的这个 Index .. export default Index ..

保存文件 ... 开发服务会自动刷新 .. 现在页面就不会显示 404 错误了 .. 这里显示的就是 Index 页面的视图 ..

再试一下 .. 调整一下编辑器的尺寸 .. 可以故意制造一个错误 .. 保存 .. 页面上会立即显示发生错误相关的信息 .. 这些信息可以帮助我们调试错误 ..

恢复一下 .. 再保存文件 .. 页面又会恢复成原来的样子 .. 这里用的技术是 webpack 提供的 hot module replacement .. 模块热替换 ..