{"record":{"id":"063151847f122eac","repo":"angular/angular-cli","slug":"only-the-application-and-browser-esbuild-build-063151","errorCode":null,"errorMessage":"Only the \"application\" and \"browser-esbuild\" builders support middleware.","messagePattern":"Only the \"application\" and \"browser-esbuild\" builders support middleware\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/angular_devkit/build_angular/src/builders/dev-server/builder.ts","lineNumber":135,"sourceCode":"              transforms,\n              extensions,\n            ),\n          ),\n        );\n      }\n\n      // Warn if the initial options provided by the user enable prebundling with Webpack-based builders\n      if (options.prebundle) {\n        context.logger.warn(\n          `Prebundling has been configured but will not be used because it is not supported by the \"${builderName}\" builder.`,\n        );\n      }\n\n      if (extensions?.buildPlugins?.length) {\n        throw new Error('Only the \"application\" and \"browser-esbuild\" builders support plugins.');\n      }\n      if (extensions?.middleware?.length) {\n        throw new Error(\n          'Only the \"application\" and \"browser-esbuild\" builders support middleware.',\n        );\n      }\n\n      // Webpack based build systems default to false for hmr option\n      normalizedOptions.hmr ??= false;\n\n      // Use Webpack for all other browser targets\n      return defer(() => import('./webpack-server')).pipe(\n        switchMap(({ serveWebpackBrowser }) =>\n          serveWebpackBrowser(normalizedOptions, builderName, context, transforms),\n        ),\n      );\n    }),\n  );\n}\n\nasync function initialize(","sourceCodeStart":117,"sourceCodeEnd":153,"githubUrl":"https://github.com/angular/angular-cli/blob/bb72145f9ab45aee29f523236b3a25cd0813a841/packages/angular_devkit/build_angular/src/builders/dev-server/builder.ts#L117-L153","documentation":"Dev-server middleware (extensions.middleware) is implemented by the esbuild/vite-based pipeline only. When middleware is supplied but the resolved builder is webpack-based, the dev-server throws rather than silently ignoring the middleware functions.","triggerScenarios":"Passing extensions: { middleware: [fn] } to the dev-server execute() while the build target uses a webpack builder (browser); programmatic scheduling of the dev-server with middleware against a webpack-based project; internal tooling that injects mock/proxy middleware unconditionally.","commonSituations":"Projects migrating from webpack to the application builder where middleware was added but legacy CI configs still select the browser builder; shared dev tooling attaching auth/mock middleware for all projects; mismatch between angular.json builder and custom scheduling code.","solutions":["Switch the build target to '@angular/build:application' or 'browser-esbuild' so middleware is supported.","Remove middleware from extensions for webpack-based dev-server runs.","Gate middleware injection on the builder being esbuild-based.","Move webpack dev-server customization to webpackDevServerConfig options (proxy, headers) which the webpack backend does support."],"exampleFix":"// before\nexecute(opts, { builderSelector }, { middleware: [(req,res,next)=>next()] })\n// after\nif (isEsbuildBased(builderName)) { extensions.middleware = [(req,res,next)=>next()]; }","handlingStrategy":"validation","validationCode":"const ESBUILD_BASED = new Set(['@angular/build:application', '@angular-devkit/build-angular:application', '@angular-devkit/build-angular:browser-esbuild']);\nif (extensions?.middleware?.length && !ESBUILD_BASED.has(builderName)) {\n  throw new Error(`middleware requires an esbuild-based builder, got ${builderName}`);\n}","typeGuard":"const supportsMiddleware = (builderName: string): boolean =>\n  /application|browser-esbuild/.test(builderName);","tryCatchPattern":"try {\n  await startDevServer(options, extensions);\n} catch (e) {\n  if (String(e.message).includes('support middleware')) {\n    // remove middleware or use webpack devServer proxy/options instead\n  }\n  throw e;\n}","preventionTips":["Only pass middleware with application/browser-esbuild builders","Use webpackDevServer options (proxy, headers, setupMiddlewares) for webpack builds","Gate middleware injection on the resolved builder","Align CI/serve configs with the project's builder type"],"tags":["angular","dev-server","middleware","esbuild","webpack"],"backgroundTag":"esbuild-plugins-unsupported-builder","analyzedSha":"bb72145f9ab45aee29f523236b3a25cd0813a841","analyzedAt":"2026-08-30T02:47:34.745Z","schemaVersion":2},"datasetVersion":"2026-08-30T03:17:51.788Z"}