Nuxt.js 命令

Nuxt.js 提供了一系列常用的命令, 用于開(kāi)發(fā)或發(fā)布部署。

命令列表

如果使用了 Koa/Express 等 Node.js Web 開(kāi)發(fā)框架，并使用了 Nuxt 作為中間件，可以自定義 Web 服務(wù)器的啟動(dòng)入口：

參數(shù)

您可以使用 --help 命令來(lái)獲取詳細(xì)用法。常見(jiàn)的命令有：

• --config-file 或 -c: 指定 nuxt.config.js 的文件路徑。
• --spa 或 -s: 禁用服務(wù)器端渲染，使用SPA模式
• --unix-socket 或 -n: 指定UNIX Socket的路徑。

你可以將這些命令添加至 package.json：

"scripts": {
  "dev": "nuxt",
  "build": "nuxt build",
  "start": "nuxt start",
  "generate": "nuxt generate"
}

這樣你可以通過(guò) npm run <command> 來(lái)執(zhí)行相應(yīng)的命令。如: npm run dev。

提示: 要將參數(shù)傳遞給npm命令，您需要一個(gè)額外的--腳本名稱(例如：npm run dev --參數(shù) --spa)

開(kāi)發(fā)模式

可通過(guò)以下命令以開(kāi)發(fā)模式啟動(dòng)帶熱加載特性的 Nuxt 服務(wù)：

nuxt
// 或
npm run dev

發(fā)布部署

Nuxt.js 提供了兩種發(fā)布部署應(yīng)用的方式：服務(wù)端渲染應(yīng)用部署 和 靜態(tài)應(yīng)用部署。

服務(wù)端渲染應(yīng)用部署

部署 Nuxt.js 服務(wù)端渲染的應(yīng)用不能直接使用 nuxt 命令，而應(yīng)該先進(jìn)行編譯構(gòu)建，然后再啟動(dòng) Nuxt 服務(wù)，可通過(guò)以下兩個(gè)命令來(lái)完成：

nuxt build
nuxt start

推薦的 package.json 配置如下：

{
  "name": "my-app",
  "dependencies": {
    "nuxt": "latest"
  },
  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start"
  }
}

提示： 建議將 .nuxt 加入 .npmignore 和 .gitignore 文件中。

靜態(tài)應(yīng)用部署

Nuxt.js 可依據(jù)路由配置將應(yīng)用靜態(tài)化，使得我們可以將應(yīng)用部署至任何一個(gè)靜態(tài)站點(diǎn)主機(jī)服務(wù)商。

可利用下面的命令生成應(yīng)用的靜態(tài)目錄和文件：

npm run generate

這個(gè)命令會(huì)創(chuàng)建一個(gè) dist 文件夾，所有靜態(tài)化后的資源文件均在其中。

如果你的項(xiàng)目需要用到動(dòng)態(tài)路由，請(qǐng)移步 generate配置API 了解如何讓 Nuxt.js 生成此類動(dòng)態(tài)路由的靜態(tài)文件。

注意：使用 nuxt generate 靜態(tài)化應(yīng)用的時(shí)候, 傳給 asyncData() 和 fetch() 方法的上下文對(duì)象 不會(huì)包含 req 和 res 兩個(gè)屬性。

單頁(yè)面應(yīng)用程序部署 (SPA)

nuxt generate 在 build/generate 時(shí)間內(nèi)仍然需要SSR引擎，同時(shí)具有預(yù)渲染所有頁(yè)面的優(yōu)勢(shì)，并具有較高的SEO優(yōu)化和頁(yè)面加載能力。 內(nèi)容在構(gòu)建時(shí)生成。例如，我們不能將它用于內(nèi)容依賴于用戶身份驗(yàn)證或?qū)崟r(shí)API的應(yīng)用程序（至少對(duì)于第一次加載）。

SPA應(yīng)用的想法很簡(jiǎn)單！ 使用時(shí)啟用SPA模式 mode: 'spa' 或 --spa，并且我們運(yùn)行打包，生成在導(dǎo)報(bào)后自動(dòng)啟動(dòng)，生成包含常見(jiàn)的meta和資源鏈接，但不包含頁(yè)面內(nèi)容。

因此，對(duì)于SPA部署，您必須執(zhí)行以下操作：

• 將nuxt.config.js中的mode更改為spa。
• 運(yùn)行 npm run build.
• 自動(dòng)生成dist/文件夾，部署到您的服務(wù)器，如Surge，GitHub Pages或nginx。

另一種可能的部署方法是在spa模式下將Nuxt用作框架中的中間件。這有助于減少服務(wù)器負(fù)載，并在無(wú)法進(jìn)行SSR的項(xiàng)目中使用Nuxt。

請(qǐng)參考 如何在 Heroku 上部署? 來(lái)查看更多部署信息。

請(qǐng)參考 如何在 GitHub Pages 上部署? 查看如何部署到GitHub頁(yè)面的更多詳細(xì)信息。