命令

Nuxt.js 提供了一系列常用的命令, 用于开发或发布部署。

命令列表

命令 描述
nuxt 启动一个热加载的Web服务器（开发模式） localhost:3000。
nuxt build 利用webpack编译应用，压缩JS和CSS资源（发布用）。
nuxt start 以生成模式启动一个Web服务器 (nuxt build 会先被执行)。
nuxt generate 编译应用，并依据路由配置生成对应的HTML文件 (用于静态站点的部署)。

你可以将这些命令添加至 package.json：

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

这样你可以通过 npm run <command> 来执行相应的命令。如: npm run dev。

开发模式

可通过以下命令以开发模式启动带热加载特性的 Nuxt 服务：

  1. nuxt
  2. // 或
  3. npm run dev

发布部署

Nuxt.js 提供了两种发布部署应用的方式：服务端渲染应用部署 和 静态应用部署。

服务端渲染应用部署

部署 Nuxt.js 服务端渲染的应用不能直接使用 nuxt 命令，而应该先进行编译构建，然后再启动 Nuxt 服务，可通过以下两个命令来完成：

  1. nuxt build
  2. nuxt start

推荐的 package.json 配置如下：

  1. {
  2.   "name": "my-app",
  3.   "dependencies": {
  4.     "nuxt": "latest"
  5.   },
  6.   "scripts": {
  7.     "dev": "nuxt",
  8.     "build": "nuxt build",
  9.     "start": "nuxt start"
  10.   }
  11. }

提示： 建议将 .nuxt 加入 .npmignore 和 .gitignore 文件中。

静态应用部署

Nuxt.js 可依据路由配置将应用静态化，使得我们可以将应用部署至任何一个静态站点主机服务商。

可利用下面的命令生成应用的静态目录和文件：

  1. npm run generate

这个命令会创建一个 dist 文件夹，所有静态化后的资源文件均在其中。

如果你的项目需要用到动态路由，请移步 generate配置API 了解如何让 Nuxt.js 生成此类动态路由的静态文件。

注意：使用 nuxt generate 静态化应用的时候, 传给 asyncData() 和 fetch() 方法的上下文对象 不会包含 req 和 res 两个属性。