From 0101aed697af615fcaae035a13635153b1369e69 Mon Sep 17 00:00:00 2001 From: Hisako Shirasaki Date: Wed, 27 Sep 2017 00:05:27 +0900 Subject: [PATCH] Translate commands.md via GitLocalize --- ja/guide/commands.md | 51 +++++++++++++++++++++++++++++++++++++------- 1 file changed, 43 insertions(+), 8 deletions(-) diff --git a/ja/guide/commands.md b/ja/guide/commands.md index 2b7486954..121b2b716 100644 --- a/ja/guide/commands.md +++ b/ja/guide/commands.md @@ -7,12 +7,21 @@ description: Nuxt.js は便利コマンドのセットを備えています。 ## コマンド一覧 -| コマンド | 説明 | -|---------|-------------| -| nuxt | 開発サーバーを [localhost:3000](http://localhost:3000) で起動します。このサーバーはホットリローディングします | -| nuxt build | アプリケーションを Webpack でビルドし、JS と CSS をプロダクション向けにミニファイします | -| nuxt start | プロダクションモードでサーバーを起動します(`nuxt build` 後に実行してください) | -| nuxt generate | アプリケーションをビルドして、ルートごとに HTML ファイルを生成します(静的ファイルのホスティングに用います) | +コマンド | 説明 +--- | --- +nuxt | 開発サーバーを [localhost:3000](http://localhost:3000) で起動します。このサーバーはホットリローディングします +nuxt build | アプリケーションを Webpack でビルドし、JS と CSS をプロダクション向けにミニファイします +nuxt start | プロダクションモードでサーバーを起動します(`nuxt build` 後に実行してください) +nuxt generate | アプリケーションをビルドして、ルートごとに HTML ファイルを生成します(静的ファイルのホスティングに用います) + +#### 引数 + +各コマンドに対して`--help`を使うと詳細な使用方法を入手できます。共通の引数は下記の通りです: + +- **`--config-file`あるいは`-c`:** `nuxt.config.js`ファイルへのパスを明記します +- **`--spa` あるいは `-s`:** サーバサイドレンダリングモードを不可にすることにより、SPAでコマンドを実行します。 + +#### package.jsonで使用する これらのコマンドを `package.json` に書いておくと良いでしょう: @@ -27,6 +36,8 @@ description: Nuxt.js は便利コマンドのセットを備えています。 そうすれば、`npm run ` 経由で Nuxt.js のコマンドを実行することができます(例: `npm run dev`) +Nuxt.js ではアプリケーションをデプロイするための 2つのモードから選べます。サーバーサイドレンダリングするモードと、静的ファイルを生成するモードです。 + ## 開発環境 Nuxt.js をホットリローディングする開発モードで起動するには: @@ -39,7 +50,7 @@ npm run dev ## プロダクションのデプロイ -Nuxt.js ではアプリケーションをデプロイするための 2つのモードから選べます。サーバーサイドレンダリングするモードと、静的ファイルを生成するモードです。 +Nuxt.jsでは3つのモードからアプリケーションのデプロイを選択できます。サーバレンダリング、SPA、そして静的生成です。 ### サーバーサイドレンダリングモードのデプロイ @@ -80,6 +91,30 @@ npm run generate `dist` フォルダが作成され、その中に静的ファイルのホスティングサービスにデプロイされるべきものがすべて入ります。 -プロジェクトで [動的なルーティング](/guide/routing#動的なルーティング) を使っている場合は、Nuxt.js に動的なルーティングを生成させるために [generate 設定](/api/configuration-generate) に目を通してください。 +プロジェクトで [動的なルーティング](/guide/routing#%E5%8B%95%E7%9A%84%E3%81%AA%E3%83%AB%E3%83%BC%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0) を使っている場合は、Nuxt.js に動的なルーティングを生成させるために [generate 設定](/api/configuration-generate) に目を通してください。 +
`nuxt generate` でウェブアプリケーションを生成するときは、[data()](/guide/async-data#the-data-method) や [fetch()](/guide/vuex-store#the-fetch-method) に渡される [context](/api#context) は `req` 及び `res` を持たなくなります。
+ + +### シングルページアプリケーションデプロイ(SPA) + +`nuxt generate` もビルド/生成の際に SSR エンジンを必要とします。 +全てのページがプリレンダリングされ高い SEO スコアとページロードスコアを持つという利点がありますが、 +一方でコンテンツは*ビルド時*に生成されるため、 +例えば、(少なくとも初回のロードで)ユーザー認証やリアルタイム API に依存するアプリケーションでは使えません。 + +SPA のアイデアは単純です! `mode: 'spa'` あるいは `--spa` フラグを使って spa モードを有効にしビルドを実行すると、 +ビルド後に自動的に生成が開始します。しかしこの時にはページコンテンツはなく、共通のメタとリソースリンクだけがあります。 + +SPAデプロイ: +- `nuxt.config.js` の中の `mode` を `spa` に変更する + - `npm run build` を実行する + - 生成された`dist/` フォルダを、surge、github pages、あるいは nginx のような静的ファイルのホスティングサービスにデプロイする + +もう1つ考えられるデプロイは、`spa` モードの間ずっと nuxt をフレームワークの中でミドルウェアとして使うことができるということです。 +これはサーバ負荷を減らすことを助け、SSR が不可能なプロジェクトで nuxt を使うことに役立ちます。 + + +
ポピュラーな hosts にデプロイする例は [FAQ/Deployments](/faq/heroku-deployment)を見てください。
+