introduction

Next.js 帮你启动、构建以及导出应用程序 ..

列出所有可用的CLi 命令

  1. npx next -h

(npx 随着npm 5.2 + 以及更高版本一同分发) …

输出如下所示

  1. Usage
  2. $ next <command>
  3. Available commands
  4. build, start, export, dev, lint, telemetry
  5. Options
  6. --version, -v Version number
  7. --help, -h Displays this message
  8. For more information run a command with the --help flag
  9. $ next build --help

你可以将任何 node 参数传递给next命令

  1. NODE_OPTIONS='--throw-deprecation' next
  2. NODE_OPTIONS='-r esm' next
  3. NODE_OPTIONS='--inspect' next

构建

next build将为你的应用程序构建一个优化生产版本,输出展示了每一个路由的信息 ..

  • Size

资源的数量(下载) - 当在客户端导航时,每一个路由的尺寸仅仅包括他们的依赖 ..

  • First Load JS

当从服务器查看这个页面的时候下载的资源数量(被共享的js数量将展示在独立的指标中)

第一次被加载的由绿色、黄色、红色指示,绿色标识性能极好的应用 …

你可以在next build的时候使用--profile标记来开启React的 性能解析,这需要Next.js 9.5

同样可以在开发中使用相同的方式使用profiler …

你能够启用更加繁琐的构建输出(通过--debug标志到 next build),这需要Next.js 9.5.3 ..

  1. next build --debug

通过这个标志你可以启用额外的构建输出(例如重写,重定义,以及headers将会被展示) ..

开发模式

next dev在开发模式下启用应用程序 ,并且具有热重载,错误报告以及更多信息 ..

默认情况下通过http://localhost:3000进行访问,通过-p进行端口修改 .

  1. npx next dev -p 4000

或者通过环境变量

  1. PORT=4000 npx next dev

注意到PORT不能够设置到.env中,因为当Http 服务器启动在任何代码初始化之前 ..

你能够设置hostname(它不同于 0.0.0.0,这能够让应用能够被处于其他网络的设备进行访问, 默认hostname 能够使用H进行改变)

  1. npx next dev -H 192.168.1.2

生产模式

next start在生产模式下启动应用程序,该应用程序首先通过next build进行编译 ..

默认情况下,通过http://localhost:3000地址访问,通过-p参数修改默认端口号 ..

  1. npx next start -p 4000

或者通过PORT环境变量

  1. PORT=4000 npx next start

注意到PORT不能够在.env中设置,因为Http Server启动在任何其他代码初始化之前 …

Lint

next lint将为在pag4es,components,lib目录下的所有文件运行ESLint 规则 ..它也提供了指南配置去安装必要的依赖(如果ESLint 当前没有在你的应用中配置的话) …

如果你有其他的目录想要进行检测,你能通过--dir标志进行指定他们 …

  1. next lint --dir utils

遥测

Next.js 收集有关常规使用下的完全匿名的遥测数据,此匿名计划并非强制参与,有关遥测的更多信息,查看文档