From e7ee9e60ba1dc65446b141753bba6f6ab0707bfa Mon Sep 17 00:00:00 2001 From: selvaraj Date: Mon, 29 Nov 2021 13:11:53 +0900 Subject: [PATCH] =?UTF-8?q?fix:=20=E7=94=A8=E8=AA=9E=E3=81=AE=E8=A1=A8?= =?UTF-8?q?=E8=A8=98=E3=81=AE=E5=AF=BE=E5=BF=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit お勧め -> おすすめ --- src/api/basic-reactivity.md | 2 +- src/api/directives.md | 2 +- src/api/instance-properties.md | 2 +- src/api/options-data.md | 4 ++-- src/api/refs-api.md | 2 +- src/cookbook/index.md | 4 ++-- src/guide/a11y-basics.md | 2 +- src/guide/component-basics.md | 14 +++++++------- src/guide/component-custom-events.md | 4 ++-- src/guide/component-registration.md | 2 +- src/guide/contributing/doc-style-guide.md | 4 ++-- src/guide/installation.md | 6 +++--- src/guide/migration/children.md | 2 +- src/guide/migration/data-option.md | 2 +- src/guide/migration/emits-option.md | 2 +- src/guide/migration/functional-components.md | 2 +- src/guide/migration/introduction.md | 2 +- src/guide/migration/migration-build.md | 4 ++-- src/guide/migration/v-if-v-for.md | 2 +- src/guide/migration/v-model.md | 4 ++-- src/guide/render-function.md | 2 +- src/guide/ssr.md | 2 +- src/guide/ssr/routing.md | 2 +- src/guide/ssr/universal.md | 4 ++-- src/guide/testing.md | 2 +- src/guide/web-components.md | 2 +- src/style-guide/README.md | 6 +++--- 27 files changed, 44 insertions(+), 44 deletions(-) diff --git a/src/api/basic-reactivity.md b/src/api/basic-reactivity.md index 7c828fad..924cf180 100644 --- a/src/api/basic-reactivity.md +++ b/src/api/basic-reactivity.md @@ -10,7 +10,7 @@ const obj = reactive({ count: 0 }) ``` -リアクティブの変換は「ディープ」で、ネストされたすべてのプロパティに影響します。[ES2015 Proxy](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Proxy) ベースの実装では、返されたプロキシは元のオブジェクトとは等しく**ありません**。元のオブジェクトに依存せず、リアクティブプロキシのみで作業することをお勧めします。 +リアクティブの変換は「ディープ」で、ネストされたすべてのプロパティに影響します。[ES2015 Proxy](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Proxy) ベースの実装では、返されたプロキシは元のオブジェクトとは等しく**ありません**。元のオブジェクトに依存せず、リアクティブプロキシのみで作業することをおすすめします。 **型:** diff --git a/src/api/directives.md b/src/api/directives.md index 76cd3667..67d484b5 100644 --- a/src/api/directives.md +++ b/src/api/directives.md @@ -62,7 +62,7 @@ このディレクティブは条件が変わったときにトランジションを引き起こします。 - 一緒に使ったとき、`v-if` は `v-for` よりも優先度が高くなります。これら 2 つのディレクティブを 1 つの要素で同時に使うことはお勧めしません。詳しくは [リストレンダリングのガイド](../guide/list.html#v-for-と-v-if) を参照してください。 + 一緒に使ったとき、`v-if` は `v-for` よりも優先度が高くなります。これら 2 つのディレクティブを 1 つの要素で同時に使うことはおすすめしません。詳しくは [リストレンダリングのガイド](../guide/list.html#v-for-と-v-if) を参照してください。 - **参照:** [条件付きレンダリング - v-if](../guide/conditional.html#v-if) diff --git a/src/api/instance-properties.md b/src/api/instance-properties.md index 3eaa5993..0f28d8e6 100644 --- a/src/api/instance-properties.md +++ b/src/api/instance-properties.md @@ -28,7 +28,7 @@ コンポーネントインスタンスが管理しているルート DOM 要素です。 - [Fragments](../guide/migration/fragments) を使っているコンポーネントでは、`$el` は DOM 内で Vue がコンポーネントの位置を追跡するために使う DOM ノードのプレースホルダになります。DOM 要素に直接アクセスするためには、`$el` に頼る代わりに [テンプレート参照](../guide/component-template-refs.html) を使うことをお勧めします。 + [Fragments](../guide/migration/fragments) を使っているコンポーネントでは、`$el` は DOM 内で Vue がコンポーネントの位置を追跡するために使う DOM ノードのプレースホルダになります。DOM 要素に直接アクセスするためには、`$el` に頼る代わりに [テンプレート参照](../guide/component-template-refs.html) を使うことをおすすめします。 ## $options diff --git a/src/api/options-data.md b/src/api/options-data.md index 01eac763..c9d227bd 100644 --- a/src/api/options-data.md +++ b/src/api/options-data.md @@ -6,9 +6,9 @@ - **詳細:** - コンポーネントインスタンスのデータオブジェクトを返す関数です。 `data` では、ブラウザの API オブジェクトや prototype プロパティのような独自のステートフルな振る舞いをするオブジェクトを監視することはお勧めしません。よい考え方としては、コンポーネントのデータを表すただのプレーンオブジェクトをここで持つべきです。 + コンポーネントインスタンスのデータオブジェクトを返す関数です。 `data` では、ブラウザの API オブジェクトや prototype プロパティのような独自のステートフルな振る舞いをするオブジェクトを監視することはおすすめしません。よい考え方としては、コンポーネントのデータを表すただのプレーンオブジェクトをここで持つべきです。 - 一度監視されると、ルートのデータオブジェクトにリアクティブなプロパティを追加することはできなくなります。そのため、インスタンスを作成する前に、すべてのルートレベルのリアクティブプロパティを前もって宣言しておくことをお勧めします。 + 一度監視されると、ルートのデータオブジェクトにリアクティブなプロパティを追加することはできなくなります。そのため、インスタンスを作成する前に、すべてのルートレベルのリアクティブプロパティを前もって宣言しておくことをおすすめします。 インスタンスが作成された後に、`vm.$data` として元のデータオブジェクトアクセスできます。コンポーネントインスタンスは、データオブジェクトのすべてのプロパティをプロキシするため、`vm.a` は `vm.$data.a` と同じになります。 diff --git a/src/api/refs-api.md b/src/api/refs-api.md index 0fb322de..03910fd3 100644 --- a/src/api/refs-api.md +++ b/src/api/refs-api.md @@ -36,7 +36,7 @@ const foo = ref('foo') // foo の型: Ref foo.value = 123 // ok! ``` -ジェネリックの型が不明な場合は、`ref` を `Ref` にキャストすることをお勧めします: +ジェネリックの型が不明な場合は、`ref` を `Ref` にキャストすることをおすすめします: ```ts function useState(initial: State) { diff --git a/src/cookbook/index.md b/src/cookbook/index.md index b08687a0..8d184c24 100644 --- a/src/cookbook/index.md +++ b/src/cookbook/index.md @@ -21,7 +21,7 @@ このクックブックでは、一般的なユースケースや興味深いユースケースを網羅した開発者向けのサンプルを提供したり、より複雑な細かい部分を段階的にに説明していきます。私たちの目標は、単純な入門的な例を超えて、より広く適用可能な概念を示すことと、アプローチの注意点を示すことです。 -貢献に興味のある方は、 **cookbook idea** というタグの下にあなたのコンセプトを書いて issue を提出して、コラボレーションを開始してください。あなたのアイデアが承認されたら、以下のテンプレートにできるだけ従ってください。いくつかのセクションは必須であり、いくつかのセクションは任意です。数字の順番に従うことを強くお勧めしますが、必須ではありません。 +貢献に興味のある方は、 **cookbook idea** というタグの下にあなたのコンセプトを書いて issue を提出して、コラボレーションを開始してください。あなたのアイデアが承認されたら、以下のテンプレートにできるだけ従ってください。いくつかのセクションは必須であり、いくつかのセクションは任意です。数字の順番に従うことを強くおすすめしますが、必須ではありません。 レシピは一般的に: @@ -65,7 +65,7 @@ ### このパターンを回避するケース -このセクションは必須ではありませんが、書くことを強くお勧めします。 状態変化に応じてクラスを切り替えるような非常に単純なものには意味がありませんが、mixins のようなより高度なパターンには不可欠です。開発に関するほとんどの質問に対する答えは ["It depends!"](https://codepen.io/rachsmith/pen/YweZbG) であり、このセクションではそれを受け入れます。ここでは、そのパターンがどのような時に役立つのか、避けるべき時はどのような時なのか、他の何かがより意味を持つ時はどのような時なのかを率直に見ていきましょう。 +このセクションは必須ではありませんが、書くことを強くおすすめします。 状態変化に応じてクラスを切り替えるような非常に単純なものには意味がありませんが、mixins のようなより高度なパターンには不可欠です。開発に関するほとんどの質問に対する答えは ["It depends!"](https://codepen.io/rachsmith/pen/YweZbG) であり、このセクションではそれを受け入れます。ここでは、そのパターンがどのような時に役立つのか、避けるべき時はどのような時なのか、他の何かがより意味を持つ時はどのような時なのかを率直に見ていきましょう。 ### 代替パターン diff --git a/src/guide/a11y-basics.md b/src/guide/a11y-basics.md index 994e9899..699aea8d 100644 --- a/src/guide/a11y-basics.md +++ b/src/guide/a11y-basics.md @@ -107,7 +107,7 @@ export default { :::tip Tip: -レガシーな [HTML5 のセマンティック要素をサポートしていないブラウザ](https://caniuse.com/#feat=html5semantic)との互換性を最大限に高めるために、冗長なランドマークロール属性を持つランドマーク HTML 要素を使用することをお勧めします。 +レガシーな [HTML5 のセマンティック要素をサポートしていないブラウザ](https://caniuse.com/#feat=html5semantic)との互換性を最大限に高めるために、冗長なランドマークロール属性を持つランドマーク HTML 要素を使用することをおすすめします。 ::: [ランドマークについてもっと読む](https://www.w3.org/TR/wai-aria-1.2/#landmark_roles) diff --git a/src/guide/component-basics.md b/src/guide/component-basics.md index e9cccc7f..53cc707e 100644 --- a/src/guide/component-basics.md +++ b/src/guide/component-basics.md @@ -80,7 +80,7 @@ app.component('my-component-name', { グローバルに登録されたコンポーネントは、アプリケーション内のどのコンポーネントのテンプレートでも使うことができます。 -とりあえずコンポーネント登録についてはこれで以上ですが、このページを読み終えて十分に理解できたら、後から戻ってきて[コンポーネント登録](component-registration.md)の完全なガイドを読むことをお勧めします。 +とりあえずコンポーネント登録についてはこれで以上ですが、このページを読み終えて十分に理解できたら、後から戻ってきて[コンポーネント登録](component-registration.md)の完全なガイドを読むことをおすすめします。 ## プロパティを用いた子コンポーネントへのデータの受け渡し @@ -154,7 +154,7 @@ app.mount('#blog-posts-demo') 上記では、 `v-bind` を用いて動的にプロパティを渡すことができると分かります。これはレンダリングする内容が事前に分からない場合に特に便利です。 -とりあえずプロパティについてはこれで以上ですが、 このページを読み終えて十分に理解できたら、後から戻ってきて[プロパティ](component-props.html)の完全なガイドを読むことをお勧めします。 +とりあえずプロパティについてはこれで以上ですが、 このページを読み終えて十分に理解できたら、後から戻ってきて[プロパティ](component-props.html)の完全なガイドを読むことをおすすめします。 ## 子コンポーネントのイベントを購読する @@ -349,7 +349,7 @@ app.component('custom-input', { }) ``` -とりあえずカスタムコンポーネントイベントについてはこれで以上ですが、このページを読み終えて十分に理解できたら、後から戻ってきて[カスタムイベント](component-custom-events.md)の完全なガイドを読むことをお勧めします。 +とりあえずカスタムコンポーネントイベントについてはこれで以上ですが、このページを読み終えて十分に理解できたら、後から戻ってきて[カスタムイベント](component-custom-events.md)の完全なガイドを読むことをおすすめします。 ## スロットによるコンテンツ配信 @@ -380,7 +380,7 @@ app.component('alert-box', { 上で見た通り、コンテンツを配置したいところにプレースホルダとして `` を使います。それだけです。終わりです！ -とりあえずスロットについてはこれで以上ですが、このページを読み終えて十分に理解できたら、後から戻ってきて[スロット](component-slots.md)の完全なガイドを読むことをお勧めします。 +とりあえずスロットについてはこれで以上ですが、このページを読み終えて十分に理解できたら、後から戻ってきて[スロット](component-slots.md)の完全なガイドを読むことをおすすめします。 ## 動的なコンポーネント @@ -404,7 +404,7 @@ app.component('alert-box', { また、 `is` 属性を使って通常の HTML 要素を作ることもできます。 -とりあえず動的なコンポーネントについてはこれで以上ですが、このページを読み終えて十分に理解できたら、後から戻ってきて[動的 & 非同期コンポーネント](./component-dynamic-async.html)の完全なガイドを読むことをお勧めします。 +とりあえず動的なコンポーネントについてはこれで以上ですが、このページを読み終えて十分に理解できたら、後から戻ってきて[動的 & 非同期コンポーネント](./component-dynamic-async.html)の完全なガイドを読むことをおすすめします。 ## DOM テンプレートパース時の注意 @@ -463,6 +463,6 @@ app.component('blog-post', { ``` -とりあえず DOM テンプレートパース時の警告についてはこれで以上です。そして実は、Vue の _本質_ の最後となります。おめでとうございます！まだまだ学ぶべきことはありますが、まずは一休みして自分で Vue を実際に使って楽しいものを作ってみることをお勧めします。 +とりあえず DOM テンプレートパース時の警告についてはこれで以上です。そして実は、Vue の _本質_ の最後となります。おめでとうございます！まだまだ学ぶべきことはありますが、まずは一休みして自分で Vue を実際に使って楽しいものを作ってみることをおすすめします。 -理解したばかりの知識に慣れてきたら、サイドバーのコンポーネントの詳細セクションの他のページと同様に、[動的 & 非同期コンポーネント](component-dynamic-async.html)の完全なガイドを読むために戻ってくることをお勧めします。 +理解したばかりの知識に慣れてきたら、サイドバーのコンポーネントの詳細セクションの他のページと同様に、[動的 & 非同期コンポーネント](component-dynamic-async.html)の完全なガイドを読むために戻ってくることをおすすめします。 diff --git a/src/guide/component-custom-events.md b/src/guide/component-custom-events.md index 5309d706..02f9a456 100644 --- a/src/guide/component-custom-events.md +++ b/src/guide/component-custom-events.md @@ -14,7 +14,7 @@ this.$emit('myEvent') ``` -[プロパティの形式](/guide/component-props.html#プロパティの形式-キャメルケース-vs-ケバブケース) と同じように、DOM 内テンプレートを使っている場合は、ケバブケースのイベントリスナを使うことをお勧めします。文字列テンプレートを使っている場合は、この制約は適用されません。 +[プロパティの形式](/guide/component-props.html#プロパティの形式-キャメルケース-vs-ケバブケース) と同じように、DOM 内テンプレートを使っている場合は、ケバブケースのイベントリスナを使うことをおすすめします。文字列テンプレートを使っている場合は、この制約は適用されません。 ## カスタムイベントの定義 @@ -31,7 +31,7 @@ app.component('custom-form', { ネイティブイベント（例、 `click` など）が `emits` オプションで定義されている場合、ネイティブイベントリスナの **代わりに** コンポーネントのイベントが使われます。 ::: tip -コンポーネントの動作を実証するために、全ての発行されたイベントを定義することをお勧めします。 +コンポーネントの動作を実証するために、全ての発行されたイベントを定義することをおすすめします。 ::: ### 発行されたイベントを検証する diff --git a/src/guide/component-registration.md b/src/guide/component-registration.md index f9d6c9df..7eeeeea8 100644 --- a/src/guide/component-registration.md +++ b/src/guide/component-registration.md @@ -159,7 +159,7 @@ ES2015 以降の場合、`ComponentA` のような変数名をオブジェクト ### モジュールシステム内のローカル登録 -もしまだこの記事を読んでいるということは、Webpack や Babel のようなモジュールシステムを利用している可能性が高いでしょう。このような場合は、それぞれのコンポーネントを独自のファイルに持つ `components` ディレクトリを作成することをお勧めします。 +もしまだこの記事を読んでいるということは、Webpack や Babel のようなモジュールシステムを利用している可能性が高いでしょう。このような場合は、それぞれのコンポーネントを独自のファイルに持つ `components` ディレクトリを作成することをおすすめします。 次にローカル登録をする前に、使用するコンポーネントごとにインポートする必要があります。例えば、`ComponentB.js` もしくは `ComponentB.vue` ファイルの場合: diff --git a/src/guide/contributing/doc-style-guide.md b/src/guide/contributing/doc-style-guide.md index d6a96287..ea8cbfd4 100644 --- a/src/guide/contributing/doc-style-guide.md +++ b/src/guide/contributing/doc-style-guide.md @@ -27,7 +27,7 @@ VuePress は、アラートボックスを作成するためのカスタムコ ::: ::: danger DANGER -これはお勧めしません。自己責任で使用してください。 +これはおすすめしません。自己責任で使用してください。 ::: ``` @@ -46,7 +46,7 @@ VuePress は、アラートボックスを作成するためのカスタムコ ::: ::: danger DANGER -これはお勧めしません。自己責任で使用してください。 +これはおすすめしません。自己責任で使用してください。 ::: ## コードブロック diff --git a/src/guide/installation.md b/src/guide/installation.md index fda9f5f4..af5d35ed 100644 --- a/src/guide/installation.md +++ b/src/guide/installation.md @@ -21,7 +21,7 @@ Vue.js をプロジェクトに追加するには主に 4 つの方法があり Learn how to install and use Vue Devtools in a free Vue School lesson -Vue を使用する場合は、ブラウザに [Vue Devtools](https://github.com/vuejs/vue-devtools#vue-devtools) をインストールすることをお勧めします。これにより、Vue アプリケーションをよりユーザーフレンドリーなインターフェースで調査、デバッグすることが可能になります。 +Vue を使用する場合は、ブラウザに [Vue Devtools](https://github.com/vuejs/vue-devtools#vue-devtools) をインストールすることをおすすめします。これにより、Vue アプリケーションをよりユーザーフレンドリーなインターフェースで調査、デバッグすることが可能になります。 [Chrome 拡張版を入手](https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg) @@ -37,7 +37,7 @@ Vue を使用する場合は、ブラウザに [Vue Devtools](https://github.com ``` -本番環境では、新しいバージョンによる意図しない不具合を避けるため、特定のバージョン番号とビルド番号にリンクすることをお勧めします。 +本番環境では、新しいバージョンによる意図しない不具合を避けるため、特定のバージョン番号とビルド番号にリンクすることをおすすめします。 ## 自分でホストする @@ -71,7 +71,7 @@ Vue 2 を使っている場合は、`@vue/compiler-sfc` が `vue-template-compil 大規模なシングルページアプリケーション開発の足場を素早く組むために、Vue は [公式 CLI](https://cli.vuejs.org/) を提供します。この CLI にはモダンなフロントエンドワークフローのための、すぐに使えるビルド設定を用意しています。ホットリロード、保存時のリント、本番リリースのビルドができるようになるまでには、ほんの数分しかかかりません。 ::: tip -CLI は Node.js と関連するビルドツールに関する予備知識を前提としています。もし、Vue またはフロントエンドビルドツールを初めて使用する場合は、CLI を使用する前に、ビルドツールなしで [ガイド](./introduction.html) を参照することを強くお勧めします。 +CLI は Node.js と関連するビルドツールに関する予備知識を前提としています。もし、Vue またはフロントエンドビルドツールを初めて使用する場合は、CLI を使用する前に、ビルドツールなしで [ガイド](./introduction.html) を参照することを強くおすすめします。 ::: `npm` 上で `@vue/cli` として、Vue 3 向けの Vue CLI v4.5 が利用可能です。以前のバージョンからアップグレードする場合は、以下のように `@vue/cli` をグローバルに再インストールしてください: diff --git a/src/guide/migration/children.md b/src/guide/migration/children.md index a3a3fa28..8f3daa97 100644 --- a/src/guide/migration/children.md +++ b/src/guide/migration/children.md @@ -37,7 +37,7 @@ export default { ## 3.x の更新 -3.x では、 `$children` プロパティが削除され、サポートされなくなりました。代わりに、もし子コンポーネントのインスタンスにアクセスする必要がある場合は、 [$refs](/guide/component-template-refs.html#template-refs) を使用することをお勧めします。 +3.x では、 `$children` プロパティが削除され、サポートされなくなりました。代わりに、もし子コンポーネントのインスタンスにアクセスする必要がある場合は、 [$refs](/guide/component-template-refs.html#template-refs) を使用することをおすすめします。 ## 移行の戦略 diff --git a/src/guide/migration/data-option.md b/src/guide/migration/data-option.md index 1159200e..6c13f818 100644 --- a/src/guide/migration/data-option.md +++ b/src/guide/migration/data-option.md @@ -120,7 +120,7 @@ Vue 2.x での `$data` の結果は: - 共有データを外部オブジェクトとして抽出し、それを `data` のプロパティとして使う - 共有データへの参照、新しい共有オブジェクトを指すようにを書き換える -ミックスインのディープマージに依存しているユーザーには、そのような依存を完全に避けるためにコードをリファクタリングすることをお勧めします。ミックスインのディープマージは非常に暗黙的であり、コードロジックの理解やデバッグがより難しくなる可能性があります。 +ミックスインのディープマージに依存しているユーザーには、そのような依存を完全に避けるためにコードをリファクタリングすることをおすすめします。ミックスインのディープマージは非常に暗黙的であり、コードロジックの理解やデバッグがより難しくなる可能性があります。 [移行ビルドのフラグ:](migration-build.html#compat-の設定) diff --git a/src/guide/migration/emits-option.md b/src/guide/migration/emits-option.md index 593ff0cb..5816ced3 100644 --- a/src/guide/migration/emits-option.md +++ b/src/guide/migration/emits-option.md @@ -53,7 +53,7 @@ Vue 2 では、コンポーネントが受け取るプロパティを定義す ## 移行の戦略 -各コンポーネントから発行されたすべてのイベントを、 `emits` を使って発行することを強くお勧めします。 +各コンポーネントから発行されたすべてのイベントを、 `emits` を使って発行することを強くおすすめします。 これは [`.native` 修飾子の削除](./v-on-native-modifier-removed.md) のために特に重要です。 `emits` で宣言されていないイベントのリスナーは、コンポーネントの `$attrs` に含まれるようになり、デフォルトではコンポーネントのルートノードに束縛されます。 diff --git a/src/guide/migration/functional-components.md b/src/guide/migration/functional-components.md index caa467ec..d7497365 100644 --- a/src/guide/migration/functional-components.md +++ b/src/guide/migration/functional-components.md @@ -25,7 +25,7 @@ Vue 2 では、関数型コンポーネントには 2 つの主要なユース しかし Vue 3 では、ステートフルコンポーネントのパフォーマンスは、その差が無視できるほどに向上しています。さらに、ステートフルコンポーネントに複数のルートノードを返す機能も追加されました。 -その結果、関数型コンポーネントに残った唯一のユースケースは、動的な見出しを作成するためのコンポーネントのようなシンプルなものだけです。それ以外の場合は、通常どおりステートフルコンポーネントを使用することをお勧めします。 +その結果、関数型コンポーネントに残った唯一のユースケースは、動的な見出しを作成するためのコンポーネントのようなシンプルなものだけです。それ以外の場合は、通常どおりステートフルコンポーネントを使用することをおすすめします。 ## 2.x での構文 diff --git a/src/guide/migration/introduction.md b/src/guide/migration/introduction.md index 1af86c25..8d62cb92 100644 --- a/src/guide/migration/introduction.md +++ b/src/guide/migration/introduction.md @@ -166,7 +166,7 @@ Vuex 4.0 は、3.x と大部分は同じ API で Vue3 のサポートを提供 ### IDE のサポート -[VSCode](https://code.visualstudio.com/) を公式の拡張機能である [Volar](https://github.com/johnsoncodehk/volar) とともに使用することをお勧めします。それにより Vue3 の包括的な IDE のサポートを得ることができます。 +[VSCode](https://code.visualstudio.com/) を公式の拡張機能である [Volar](https://github.com/johnsoncodehk/volar) とともに使用することをおすすめします。それにより Vue3 の包括的な IDE のサポートを得ることができます。 ## その他のプロジェクト diff --git a/src/guide/migration/migration-build.md b/src/guide/migration/migration-build.md index 4cb7a8d2..ddb05a0b 100644 --- a/src/guide/migration/migration-build.md +++ b/src/guide/migration/migration-build.md @@ -16,7 +16,7 @@ 移行ビルドは Vue 2 の動作を可能な限り模倣するようにしていますが、次のようないくつかの制限事項があるため、アプリがアップグレードの対象にならない場合があります。 -- Vue 2 の内部 API またはドキュメント化されていない動作に頼った依存関係。最も一般的なケースは、 `VNodes` プライベートプロパティの使用です。[Vuetify](https://vuetifyjs.com/en/)、[Quasar](https://quasar.dev/)、[ElementUI](https://element.eleme.io/#/en-US)などのコンポーネントライブラリに依存している場合は、Vue 3 と互換性のあるバージョンを待つことをお勧めします。 +- Vue 2 の内部 API またはドキュメント化されていない動作に頼った依存関係。最も一般的なケースは、 `VNodes` プライベートプロパティの使用です。[Vuetify](https://vuetifyjs.com/en/)、[Quasar](https://quasar.dev/)、[ElementUI](https://element.eleme.io/#/en-US)などのコンポーネントライブラリに依存している場合は、Vue 3 と互換性のあるバージョンを待つことをおすすめします。 - Internet Explorer 11 のサポート: [Vue 3 は公式に IE11 サポートの計画を中止しました](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0038-vue3-ie11-support.md)。まだ IE11 以下をサポートする必要がある場合は、Vue 2 のままにしておく必要があります。 @@ -174,7 +174,7 @@ コマンドラインとブラウザのコンソールの両方に、たくさんの警告が表示されると思います。ここでは一般的なヒントをご紹介します。 - - ブラウザのコンソールでは、特定の警告をフィルタリングすることができます。フィルタを使用して、一度に 1 つの項目を修正することに集中することをお勧めします。また、`-GLOBAL_MOUNT` のような否定のフィルタを使うこともできます。 + - ブラウザのコンソールでは、特定の警告をフィルタリングすることができます。フィルタを使用して、一度に 1 つの項目を修正することに集中することをおすすめします。また、`-GLOBAL_MOUNT` のような否定のフィルタを使うこともできます。 - [compat の設定](#compat-の設定)で特定の非推奨事項を抑制することができます。 diff --git a/src/guide/migration/v-if-v-for.md b/src/guide/migration/v-if-v-for.md index 97f8f58f..fa865d25 100644 --- a/src/guide/migration/v-if-v-for.md +++ b/src/guide/migration/v-if-v-for.md @@ -24,7 +24,7 @@ Vue.js で最も一般的に使われているディレクティブの 2 つは ## 移行の戦略 -構文の曖昧さにより、同じエレメントで両方の使用を避けることをお勧めします。 +構文の曖昧さにより、同じエレメントで両方の使用を避けることをおすすめします。 これをテンプレートレベルで管理するのではなく、これを実現する 1 つの方法は表示されている要素のリストを除外する算出プロパティを作成することです。 diff --git a/src/guide/migration/v-model.md b/src/guide/migration/v-model.md index 52d99f7f..9943d29a 100644 --- a/src/guide/migration/v-model.md +++ b/src/guide/migration/v-model.md @@ -74,7 +74,7 @@ export default { ### `v-bind.sync` の使用について -場合によっては、プロパティへの「双方向バインディング」が必要になります（時々、既存の `v-model` に加えて別のプロパティを使うために）。そのためには、`update:myPropName` のパターンでのイベント発火をお勧めしていました。たとえば、`title` プロパティを使用した前の例の `ChildComponent` の場合、新しい値に更新するイベントを次のように発火できました。 +場合によっては、プロパティへの「双方向バインディング」が必要になります（時々、既存の `v-model` に加えて別のプロパティを使うために）。そのためには、`update:myPropName` のパターンでのイベント発火をおすすめしていました。たとえば、`title` プロパティを使用した前の例の `ChildComponent` の場合、新しい値に更新するイベントを次のように発火できました。 ```js this.$emit('update:title', newValue) @@ -148,7 +148,7 @@ this.$emit('update:title', newValue) ## 移行の戦略 -以下をお勧めします。 +以下をおすすめします。 - コードベースに `.sync` を使用しているかチェックして、`v-model` に置き換えてください。 diff --git a/src/guide/render-function.md b/src/guide/render-function.md index 89da168c..ca3240a0 100644 --- a/src/guide/render-function.md +++ b/src/guide/render-function.md @@ -81,7 +81,7 @@ app.component('anchored-heading', { }) ``` -`render()` 関数の実装はとても単純ですが、コンポーネントインスタンスのプロパティについてよく理解している必要があります。この場合では、 `anchored-heading` の内側の `Hello world!` のように `v-slot` ディレクティブなしで子供を渡した時には、その子供は `$slots.default()` のコンポーネントインスタンスに保持されるということを知っている必要があります。もしまだ知らないのであれば、 **render 関数に取り掛かる前に [インスタンスプロパティ API](../api/instance-properties.html) を通読することをお勧めします。** +`render()` 関数の実装はとても単純ですが、コンポーネントインスタンスのプロパティについてよく理解している必要があります。この場合では、 `anchored-heading` の内側の `Hello world!` のように `v-slot` ディレクティブなしで子供を渡した時には、その子供は `$slots.default()` のコンポーネントインスタンスに保持されるということを知っている必要があります。もしまだ知らないのであれば、 **render 関数に取り掛かる前に [インスタンスプロパティ API](../api/instance-properties.html) を通読することをおすすめします。** ## DOM ツリー diff --git a/src/guide/ssr.md b/src/guide/ssr.md index da654069..7b6bbda9 100644 --- a/src/guide/ssr.md +++ b/src/guide/ssr.md @@ -6,7 +6,7 @@ ## Nuxt.js -これまでに議論されたすべての側面を適切に構成するプロダクション向けのサーバーレンダリングに対応したアプリケーションの開発は難しい作業です。幸いにも、これをもっと簡単にすることを目指す優れたコミュニティプロジェクト [Nuxt.js](https://nuxtjs.org/) があります。Nuxt.js は、Vue エコシステムの上に構築された高レベルのフレームワークで、ユニバーサル Vue アプリケーションを作成するための非常に合理的な開発エクスペリエンスを提供します。さらに、静的なサイトジェネレータ (単一ファイルの Vue コンポーネントとして作成されたページ) としても使用できます！試してみることを強くお勧めします。 +これまでに議論されたすべての側面を適切に構成するプロダクション向けのサーバーレンダリングに対応したアプリケーションの開発は難しい作業です。幸いにも、これをもっと簡単にすることを目指す優れたコミュニティプロジェクト [Nuxt.js](https://nuxtjs.org/) があります。Nuxt.js は、Vue エコシステムの上に構築された高レベルのフレームワークで、ユニバーサル Vue アプリケーションを作成するための非常に合理的な開発エクスペリエンスを提供します。さらに、静的なサイトジェネレータ (単一ファイルの Vue コンポーネントとして作成されたページ) としても使用できます！試してみることを強くおすすめします。 ## Quasar Framework SSR + PWA diff --git a/src/guide/ssr/routing.md b/src/guide/ssr/routing.md index 7c78e302..03ce7e1a 100644 --- a/src/guide/ssr/routing.md +++ b/src/guide/ssr/routing.md @@ -4,7 +4,7 @@ ここまでのサーバコードで、任意の URL を受け付ける `*` ハンドラを使っていることに気づいたかもしれません。これにより訪問した URL を Vue アプリケーションに渡すことができ、クライアントとサーバの両方で同じルーティング設定を再利用することができます！ -この目的のためには、公式の [vue-router](https://github.com/vuejs/vue-router-next) ライブラリを使うことをお勧めします。まず、ルータを作るためのファイルを作成します。アプリケーションのインスタンスと同様に、リクエストごとに新しいルータのインスタンスが必要なので、このファイルでは `createRouter` 関数をエクスポートします: +この目的のためには、公式の [vue-router](https://github.com/vuejs/vue-router-next) ライブラリを使うことをおすすめします。まず、ルータを作るためのファイルを作成します。アプリケーションのインスタンスと同様に、リクエストごとに新しいルータのインスタンスが必要なので、このファイルでは `createRouter` 関数をエクスポートします: ```js // router.js diff --git a/src/guide/ssr/universal.md b/src/guide/ssr/universal.md index 05f9bade..eeda32aa 100644 --- a/src/guide/ssr/universal.md +++ b/src/guide/ssr/universal.md @@ -18,7 +18,7 @@ Universal コードは、プラットフォーム固有の API アクセスを前提にできないため、コードが `window` や `document` のようなブラウザ専用のグローバル変数を直接使用している場合、 Node.js で実行するとエラーが発生しますし、その逆も同様です。 -サーバとクライアントで共有されたタスクで、異なるプラットフォームの API を使っている場合は、プラットフォーム固有の実装を Universal API の中にラップするか、これを行うライブラリの使用をお勧めします。例えば、 [axios](https://github.com/axios/axios) は、サーバとクライアントの両方に同じ API を提供する HTTP クライアントです。 +サーバとクライアントで共有されたタスクで、異なるプラットフォームの API を使っている場合は、プラットフォーム固有の実装を Universal API の中にラップするか、これを行うライブラリの使用をおすすめします。例えば、 [axios](https://github.com/axios/axios) は、サーバとクライアントの両方に同じ API を提供する HTTP クライアントです。 ブラウザ専用の API の場合は、クライアント用のライフサイクルフックの中で遅延アクセスするのが一般的なアプローチです。 @@ -26,4 +26,4 @@ Universal コードは、プラットフォーム固有の API アクセスを ## カスタムディレクティブ -ほとんどの [カスタムディレクティブ](/guide/custom-directive.html#custom-directives) は DOM を直接操作するため、SSR 中にエラーが発生します。このため、抽象化の仕組みとしてはディレクティブではなくコンポーネントを使うことをお勧めします。 +ほとんどの [カスタムディレクティブ](/guide/custom-directive.html#custom-directives) は DOM を直接操作するため、SSR 中にエラーが発生します。このため、抽象化の仕組みとしてはディレクティブではなくコンポーネントを使うことをおすすめします。 diff --git a/src/guide/testing.md b/src/guide/testing.md index 9bc91bf6..635b846a 100644 --- a/src/guide/testing.md +++ b/src/guide/testing.md @@ -86,7 +86,7 @@ Vue Testing Library は、実装の詳細に依存せずにコンポーネント #### Vue Test Utils -Vue Test Utils は、ユーザーが Vue 固有の API へのアクセスを提供するために書かれた公式の低レベルコンポーネントテストライブラリです。Vue アプリケーションのテストを初めて行う場合は、Vue Test Utils を抽象化した Vue Testing Library を使用することをお勧めします。 +Vue Test Utils は、ユーザーが Vue 固有の API へのアクセスを提供するために書かれた公式の低レベルコンポーネントテストライブラリです。Vue アプリケーションのテストを初めて行う場合は、Vue Test Utils を抽象化した Vue Testing Library を使用することをおすすめします。 **リソース:** diff --git a/src/guide/web-components.md b/src/guide/web-components.md index 98d99b4f..d3034835 100644 --- a/src/guide/web-components.md +++ b/src/guide/web-components.md @@ -203,7 +203,7 @@ Vue でカスタム要素をビルドする場合、要素は Vue のランタ もし、カスタム要素が Vue を使用しているアプリケーションで使用される場合、ビルドされたバンドルから Vue を外部化することを選択し、要素がホストアプリケーションの Vue の同じコピーを使用するようにできます。 -個々の要素コンストラクタをエクスポートして、ユーザーが必要に応じてインポートしたり、必要なタグ名で登録したりできる柔軟性を持たせることをお勧めします。また、すべての要素を自動的に登録する便利な関数をエクスポートすることもできます。以下は、Vue カスタム要素ライブラリのエントリーポイントの例です: +個々の要素コンストラクタをエクスポートして、ユーザーが必要に応じてインポートしたり、必要なタグ名で登録したりできる柔軟性を持たせることをおすすめします。また、すべての要素を自動的に登録する便利な関数をエクスポートすることもできます。以下は、Vue カスタム要素ライブラリのエントリーポイントの例です: ```js import { defineCustomElement } from 'vue' diff --git a/src/style-guide/README.md b/src/style-guide/README.md index 3e4cba28..b3040eac 100644 --- a/src/style-guide/README.md +++ b/src/style-guide/README.md @@ -129,7 +129,7 @@ props: { **`v-for` に対しては常に `key` を使用してください。** -サブツリーの内部コンポーネントの状態を維持するために、コンポーネントでの `v-for` には _常に_ `key` を付ける必要があります。ただし要素の場合であっても、アニメーションでの [オブジェクトの一貫性](https://bost.ocks.org/mike/constancy/) のように、予測可能な振る舞いを維持することをお勧めします。 +サブツリーの内部コンポーネントの状態を維持するために、コンポーネントでの `v-for` には _常に_ `key` を付ける必要があります。ただし要素の場合であっても、アニメーションでの [オブジェクトの一貫性](https://bost.ocks.org/mike/constancy/) のように、予測可能な振る舞いを維持することをおすすめします。 ::: details 詳細な説明 TODO リストを持っているとしましょう: @@ -155,7 +155,7 @@ data() { 問題は、DOM に残る要素を削除しないことが重要となる場合があることです。 例えば、 `` を使用してリストの並べ替えをアニメーション化する場合だったり、レンダリングされた要素が `` の時はフォーカスを維持したいといった場合があります。 このような場合、アイテムごとに一意のキー (`:key="todo.id"` など) を追加することで、 Vue に対してどうしたらより予期した通りの動作ができるかを伝えることができます。 -これまでの経験から、あなたとあなたのチームがこれらのエッジケースについて心配する必要がないように、 _常に_ 一意のキーを追加することをお勧めします。 その上で、オブジェクトの一貫性が必要なくてパフォーマンスが重要な稀なシナリオにおいては、意識的な例外を作成すると良いでしょう。 +これまでの経験から、あなたとあなたのチームがこれらのエッジケースについて心配する必要がないように、 _常に_ 一意のキーを追加することをおすすめします。 その上で、オブジェクトの一貫性が必要なくてパフォーマンスが重要な稀なシナリオにおいては、意識的な例外を作成すると良いでしょう。 :::
@@ -387,7 +387,7 @@ Vue は `_` のプレフィックスを使用して独自のプライベート `$` のプレフィックスに関しては、Vue エコシステム内でのそのプレフィックスの目的は、ユーザーに公開される特別なインスタンスプロパティであるため、_独自_プロパティに使用することは適切ではありません。 -代わりに、Vue との競合がないことを保証するユーザー定義のプライベートプロパティの規則として、2 つのプレフィックスを `$_` に結合することをお勧めしています。 +代わりに、Vue との競合がないことを保証するユーザー定義のプライベートプロパティの規則として、2 つのプレフィックスを `$_` に結合することをおすすめしています。 :::