Repository navigation
proxyConfig option is not working with esbuild dev server #25337
Description
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
No response
Description
Trying the new esbuild builder in a project and seems the proxyConfig option in angular config is not considered. For example in .NET Core project we are using proxy to map API calls to the .NET Core dev server. This works perfectly with the webpack builder. With the new builder any call to /api results in a 404 error and the request does not seem to get to the .NET dev server.
I know not all options are supported yet, but in the didn't see proxyConfig being mentioned in the Known Limitations section of the help article.
Minimal Reproduction
angular.json excerpt:
"build": {
"builder": "@angular-devkit/build-angular:browser-esbuild",
"options": {
"outputPath": "dist/my-proj",
"index": "projects/my-proj/src/index.html",
"main": "projects/my-proj/src/main.ts",
"polyfills": "projects/my-proj/src/polyfills.ts",
"tsConfig": "projects/my-proj/tsconfig.app.json",
"inlineStyleLanguage": "scss",
"assets": [
"projects/my-proj/src/favicon.ico",
"projects/my-proj/src/assets"
],
"styles": [
"shared/bootstrap.scss",
"shared/kendo-theme.scss",
"projects/my-proj/src/styles.scss"
],
"allowedCommonJsDependencies": [
"argsarray",
"immediate",
"inherits",
"spark-md5",
"vuvuzela"
],
"scripts": []
},
"configurations": {
"production": {
"budgets": [
{
"type": "initial",
"maximumWarning": "3.75mb",
"maximumError": "4mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "2kb",
"maximumError": "4kb"
}
],
"fileReplacements": [
{
"replace": "projects/my-proj/src/environments/environment.ts",
"with": "projects/my-proj/src/environments/environment.prod.ts"
}
],
"outputHashing": "all"
},
"development": {
"buildOptimizer": false,
"optimization": false,
"vendorChunk": true,
"extractLicenses": false,
"sourceMap": true,
"namedChunks": true
}
},
"defaultConfiguration": "production"
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"browserTarget": "my-proj:build:production"
},
"development": {
"browserTarget": "my-proj:build:development",
"proxyConfig": "projects/my-proj/proxy.conf.js"
}
},
"defaultConfiguration": "development"
},
Proxy config file:
module.exports = [
{
context: [
"/api",
"/signalr"
],
target: "https://localhost:7051",
secure: false,
ws: true,
headers: {
Connection: 'Keep-Alive'
}
}
];Exception or Error
No response
Your Environment
Angular CLI: 16.0.3
Node: 16.15.1
Package Manager: npm 9.4.2
OS: win32 x64
Angular: 16.0.3
... animations, cli, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1600.3
@angular-devkit/build-angular 16.0.3
@angular-devkit/core 16.0.3
@angular-devkit/schematics 16.0.3
@schematics/angular 16.0.3
rxjs 7.5.7
typescript 5.0.4
Anything else relevant?
No response
Activity
clydin commentedon Jun 8, 2023
Unfortunately, the array form of the proxy configuration is not currently supported by Vite (the underlying development server implementation). We will need to provide an internal transform to allow it to function as expected.
In the interim, you should be able to convert the proxy configuration to the object form to workaround the issue although it does require some duplication:
PeterStaev commentedon Jun 9, 2023
Thanks @clydin , I can confirm that the object notation of the routes workaround works.
angular-automatic-lock-bot commentedon Jul 10, 2023
This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.