Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Vite dev server: proxy config normalization reorders glob keys, drops string `context` and misses URLs with a query string

オープン
#34,257 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

関連するプルリクエストがすでにマージされています。

  • #34258 @aminesbdev による — マージ済み

評価

難易度
4/5
見積もり時間
3〜5日
初心者へのやさしさ
65/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
angular, node.js, typescript, vite
領域
backend, devtools

調査の方向性

Start with packages/angular/build/src/utils/load-proxy-config.ts and inspect normalizeProxyConfiguration, then trace how Vite matches proxy patterns against request URLs. Check existing proxy configuration tests and run the relevant tests for ordering, string context, and query strings. Done means all three reproductions proxy to the expected backend without changing unrelated matching behavior.

索引モデルが issue の本文から書いたものです。

説明

area: @angular/build
Command

serve

Is this a regression?
  • Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was

The webpack-based @angular-devkit/build-angular:dev-server

Description

normalizeProxyConfiguration in packages/angular/build/src/utils/load-proxy-config.ts turns the proxy file into the object Vite expects. Three things get lost along the way. In each case the request isn't proxied and falls through to the app (index.html), and nothing shows up in the ng serve output.

  1. Glob entries lose their position. Each glob key is replaced with normalizedProxy[pattern] = …; delete normalizedProxy[key], which moves it to the end of the object. Vite uses the first entry that matches, so a specific glob written first loses to a broader plain key written after it.
  2. A string context drops the whole entry. In the array form, an entry whose context isn't an array is skipped. webpack-dev-server passes context to http-proxy-middleware as pathFilter, which accepts a single string, so context: '/legacy' works there. The array form conversion was added after #25337 so that webpack-style configs keep working, and this case slipped through.
  3. Globs are matched against the URL including its query string. The regex built by picomatch ends with $ and Vite tests it against req.url, so /search/** matches /search but not /search?q=angular. http-proxy-middleware matches both globs and plain keys against the pathname only.
Minimal Reproduction

A new app served by @angular/build:dev-server, plus a backend that echoes the port and URL it receives:

// backend.mjs
import http from 'node:http';
for (const port of [3998, 3999]) {
  http.createServer((req, res) => res.end(`${port} got ${req.url}\n`)).listen(port);
}

1. Order with ng serve --proxy-config proxy.conf.json:

{
  "/api/auth/**": {"target": "http://localhost:3998"},
  "/api/": {"target": "http://localhost:3999"}
}

curl localhost:4200/api/auth/login returns 3999 got /api/auth/login. I expected it to go to 3998.

2. String context with ng serve --proxy-config proxy.conf.mjs:

export default [{context: '/legacy', target: 'http://localhost:3999'}];

curl localhost:4200/legacy/users returns index.html. loadProxyConfiguration returns {} for this file.

3. Query string with ng serve --proxy-config proxy.conf.json:

{
  "/search/**": {"target": "http://localhost:3999"}
}

curl localhost:4200/search is proxied, but curl 'localhost:4200/search?q=angular' returns index.html.

Exception or Error
None. The requests are just not proxied.
Your Environment
Angular CLI       : 22.2.0
Angular           : 22.2.0
Node.js           : 24.21.0
Package Manager   : npm 11.19.0
Operating System  : darwin arm64

@angular/build    : 22.2.0
@angular/cli      : 22.2.0
vite              : 8.3.0

The code is the same on main.

Anything else relevant?

#34258 fixes the first two points. The third one isn't part of it: for a trailing /**, picomatch puts a $ inside the generated regex, so it takes more than appending an optional query string, and it changes which requests get proxied.

主要言語
TypeScript
スター
27k
フォーク
11.8k
平均マージ
1日 2分
マージ済み PR(30日)
168

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

angular/angular-cli のほかの issue

angular/angular-cli の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。