diff --git a/adev-ja/src/content/events/v21.en.md b/adev-ja/src/content/events/v21.en.md index e1a21e0c0..e1f5ace3b 100644 --- a/adev-ja/src/content/events/v21.en.md +++ b/adev-ja/src/content/events/v21.en.md @@ -1,4 +1,4 @@ -![A retro 8-bit, pixel art style graphic announcing the upcoming release of Angular v21. The large, gradient 'v21' text dominates the frame. Next to it, in smaller text, are the words 'The Adventure Begins' and the release date '11-20-2025' inside a pink pixelated box. The Angular logo is in the bottom right corner.](assets/images/angular-v21-hero.jpg {loading: 'eager', fetchpriority: 'high'} 'Angular v21 Hero Image') +![A retro 8-bit, pixel art style graphic announcing the upcoming release of Angular v21. The large, gradient 'v21' text dominates the frame. Next to it, in smaller text, are the words 'The Adventure Begins' and the release date '11-20-2025' inside a pink pixelated box. The Angular logo is in the bottom right corner.](assets/images/v21-event/angular-v21-hero.jpg {loading: 'eager', fetchpriority: 'high'} 'Angular v21 Hero Image') # Angular v21: The Adventure Begins diff --git a/adev-ja/src/content/events/v21.md b/adev-ja/src/content/events/v21.md index 2afeaada3..3e307640f 100644 --- a/adev-ja/src/content/events/v21.md +++ b/adev-ja/src/content/events/v21.md @@ -1,4 +1,4 @@ -![Angular v21の今後のリリースを告知する、レトロな8ビットのピクセルアートスタイルのグラフィック。大きなグラデーションの「v21」テキストがフレームを占めています。その隣には、小さなテキストで「The Adventure Begins」という言葉と、ピンク色のピクセル化されたボックス内にリリース日「11-20-2025」が記載されています。Angularのロゴは右下隅にあります。](assets/images/angular-v21-hero.jpg {loading: 'eager', fetchpriority: 'high'} 'Angular v21ヒーロー画像') +![Angular v21の今後のリリースを告知する、レトロな8ビットのピクセルアートスタイルのグラフィック。大きなグラデーションの「v21」テキストがフレームを占めています。その隣には、小さなテキストで「The Adventure Begins」という言葉と、ピンク色のピクセル化されたボックス内にリリース日「11-20-2025」が記載されています。Angularのロゴは右下隅にあります。](assets/images/v21-event/angular-v21-hero.jpg {loading: 'eager', fetchpriority: 'high'} 'Angular v21ヒーロー画像') # Angular v21: 冒険の始まり diff --git a/adev-ja/src/content/tools/cli/serve.en.md b/adev-ja/src/content/tools/cli/serve.en.md index fe6761cb5..34cab1771 100644 --- a/adev-ja/src/content/tools/cli/serve.en.md +++ b/adev-ja/src/content/tools/cli/serve.en.md @@ -4,8 +4,7 @@ You can serve your Angular CLI application with the `ng serve` command. This will compile your application, skip unnecessary optimizations, start a devserver, and automatically rebuild and live reload any subsequent changes. You can stop the server by pressing `Ctrl+C`. -`ng serve` only executes the builder for the `serve` target in the default project as specified in `angular.json`. -While any builder can be used here, the most common (and default) builder is `@angular-devkit/build-angular:dev-server`. +`ng serve` only executes the builder for the `serve` target in the default project as specified in `angular.json`. While any builder can be used here, the most common (and default) builder is `@angular/build:dev-server`. You can determine which builder is being used for a particular project by looking up the `serve` target for that project. @@ -17,10 +16,10 @@ You can determine which builder is being used for a particular project by lookin "architect": { // `ng serve` invokes the Architect target named `serve`. "serve": { - "builder": "@angular-devkit/build-angular:dev-server", + "builder": "@angular/build:dev-server", // ... }, - "build": { /* ... */ } + "build": { /* ... */ }, "test": { /* ... */ } } } @@ -29,11 +28,9 @@ You can determine which builder is being used for a particular project by lookin ``` -This page discusses usage and options of `@angular-devkit/build-angular:dev-server`. - ## Proxying to a backend server -Use [proxying support](https://webpack.js.org/configuration/dev-server/#devserverproxy) to divert certain URLs to a backend server, by passing a file to the `--proxy-config` build option. +Use [proxying support](https://vite.dev/config/server-options#server-proxy) to divert certain URLs to a backend server, by passing a file to the `--proxy-config` build option. For example, to divert all calls for `http://localhost:4200/api` to a server running on `http://localhost:3000/api`, take the following steps. 1. Create a file `proxy.conf.json` in your project's `src/` folder. @@ -41,9 +38,9 @@ For example, to divert all calls for `http://localhost:4200/api` to a server run ```json { - "/api": { - "target": "http://localhost:3000", - "secure": false + "/api/**": { + "target": "http://localhost:3000", + "secure": false } } ``` @@ -56,10 +53,10 @@ For example, to divert all calls for `http://localhost:4200/api` to a server run "my-app": { "architect": { "serve": { - "builder": "@angular-devkit/build-angular:dev-server", + "builder": "@angular/build:dev-server", "options": { - "proxyConfig": "src/proxy.conf.json" - } + "proxyConfig": "src/proxy.conf.json" + } } } } @@ -70,7 +67,16 @@ For example, to divert all calls for `http://localhost:4200/api` to a server run 1. To run the development server with this proxy configuration, call `ng serve`. -Edit the proxy configuration file to add configuration options; following are some examples. -For a detailed description of all options, refer to the [webpack DevServer documentation](https://webpack.js.org/configuration/dev-server/#devserverproxy) when using `@angular-devkit/build-angular:browser`, or the [Vite DevServer documentation](https://vite.dev/config/server-options#server-proxy) when using `@angular-devkit/build-angular:browser-esbuild` or `@angular-devkit/build-angular:application`. +NOTE: To apply changes made to your proxy configuration file, you must restart the `ng serve` process. + +### Path matching behavior depends on the builder + +**`@angular/build:dev-server`** (based on [Vite](https://vite.dev/config/server-options#server-proxy)) + +- `/api` matches only `/api`. +- `/api/*` matches `/api/users` but not `/api/users/123`. +- `/api/**` matches `/api/users` and `/api/users/123`. + +**`@angular-devkit/build-angular:dev-server`** (based on [Webpack DevServer](https://webpack.js.org/configuration/dev-server/#devserverproxy)) -NOTE: If you edit the proxy configuration file, you must relaunch the `ng serve` process to make your changes effective. +- `/api` matches `/api` and any sub-paths (equivalent to `/api/**`). diff --git a/adev-ja/src/content/tools/cli/serve.md b/adev-ja/src/content/tools/cli/serve.md index ff2873150..1359bad07 100644 --- a/adev-ja/src/content/tools/cli/serve.md +++ b/adev-ja/src/content/tools/cli/serve.md @@ -4,8 +4,7 @@ Angular CLIアプリケーションは、`ng serve`コマンドで配信でき これにより、アプリケーションがコンパイルされ、不要な最適化がスキップされ、開発サーバーが起動し、その後の変更が自動的に再ビルドおよびライブリロードされます。 サーバーは`Ctrl+C`を押して停止できます。 -`ng serve`は、`angular.json`で指定されたデフォルトプロジェクトの`serve`ターゲットのビルダーのみを実行します。 -ここでは任意のビルダーを使用できますが、最も一般的（かつデフォルト）なビルダーは`@angular-devkit/build-angular:dev-server`です。 +`ng serve`は、`angular.json`で指定されたデフォルトプロジェクトの`serve`ターゲットのビルダーのみを実行します。ここでは任意のビルダーを使用できますが、最も一般的(かつデフォルト)なビルダーは`@angular/build:dev-server`です。 特定のプロジェクトで使用されているビルダーは、そのプロジェクトの`serve`ターゲットを調べることで判断できます。 @@ -17,10 +16,10 @@ Angular CLIアプリケーションは、`ng serve`コマンドで配信でき "architect": { // `ng serve` invokes the Architect target named `serve`. "serve": { - "builder": "@angular-devkit/build-angular:dev-server", + "builder": "@angular/build:dev-server", // ... }, - "build": { /* ... */ } + "build": { /* ... */ }, "test": { /* ... */ } } } @@ -29,11 +28,9 @@ Angular CLIアプリケーションは、`ng serve`コマンドで配信でき ``` -このページでは、`@angular-devkit/build-angular:dev-server`の使用法とオプションについて説明します。 - ## バックエンドサーバーへのプロキシ {#proxying-to-a-backend-server} -[プロキシサポート](https://webpack.js.org/configuration/dev-server/#devserverproxy)を使用して、特定のURLをバックエンドサーバーに転送するには、`--proxy-config`ビルドオプションにファイルを渡します。 +[プロキシサポート](https://vite.dev/config/server-options#server-proxy)を使用して、特定のURLをバックエンドサーバーに転送するには、`--proxy-config`ビルドオプションにファイルを渡します。 例えば、`http://localhost:4200/api`へのすべての呼び出しを`http://localhost:3000/api`で実行されているサーバーに転送するには、以下の手順を実行します。 1. プロジェクトの`src/`フォルダーに`proxy.conf.json`ファイルを作成します。 @@ -41,9 +38,9 @@ Angular CLIアプリケーションは、`ng serve`コマンドで配信でき ```json { - "/api": { - "target": "http://localhost:3000", - "secure": false + "/api/**": { + "target": "http://localhost:3000", + "secure": false } } ``` @@ -56,10 +53,10 @@ Angular CLIアプリケーションは、`ng serve`コマンドで配信でき "my-app": { "architect": { "serve": { - "builder": "@angular-devkit/build-angular:dev-server", + "builder": "@angular/build:dev-server", "options": { - "proxyConfig": "src/proxy.conf.json" - } + "proxyConfig": "src/proxy.conf.json" + } } } } @@ -70,7 +67,16 @@ Angular CLIアプリケーションは、`ng serve`コマンドで配信でき 1. このプロキシ設定で開発サーバーを実行するには、`ng serve`を呼び出します。 -プロキシ設定ファイルを編集して設定オプションを追加します。以下にいくつかの例を示します。 -すべてのオプションの詳細については、`@angular-devkit/build-angular:browser`を使用する場合は[webpack DevServerドキュメント](https://webpack.js.org/configuration/dev-server/#devserverproxy)を、または`@angular-devkit/build-angular:browser-esbuild`または`@angular-devkit/build-angular:application`を使用する場合は[Vite DevServerドキュメント](https://vite.dev/config/server-options#server-proxy)を参照してください。 +NOTE: プロキシ設定ファイルに加えた変更を適用するには、`ng serve`プロセスを再起動する必要があります。 + +### パスマッチングの挙動はビルダーに依存する {#path-matching-behavior-depends-on-the-builder} + +**`@angular/build:dev-server`** ([Vite](https://vite.dev/config/server-options#server-proxy)ベース) + +- `/api`は`/api`のみにマッチします。 +- `/api/*`は`/api/users`にマッチしますが、`/api/users/123`にはマッチしません。 +- `/api/**`は`/api/users`と`/api/users/123`の両方にマッチします。 + +**`@angular-devkit/build-angular:dev-server`** ([Webpack DevServer](https://webpack.js.org/configuration/dev-server/#devserverproxy)ベース) -NOTE: プロキシ設定ファイルを編集した場合、変更を有効にするには`ng serve`プロセスを再起動する必要があります。 +- `/api`は`/api`とすべてのサブパスにマッチします(`/api/**`と同等)。 diff --git a/origin b/origin index 72b1f7fd4..5961e9619 160000 --- a/origin +++ b/origin @@ -1 +1 @@ -Subproject commit 72b1f7fd4319c2f2a1ddfc43d4b8e9ffde10056f +Subproject commit 5961e96196b90ae08a1ad266d3786eaed935db41