我可以在 Angular CLI 应用程序中将自定义中间件添加到开发服务器吗？

Question

本质上，我想扩展 Angular CLI 的代理，以启用我们组织使用的一些自定义 Express 中间件来支持独特的身份验证模型。

Create React App通过公开 Express 应用程序实例并让您app.use()拥有自己的中间件来支持这一点。

我找不到 Angular CLI 来支持这一点的方法。不弹出这个可行吗？

Answer 1

Angular (8+) 自定义构建器支持此功能。

特别是，custom-webpack构建器允许您使用 Webpack 的before钩子集成到自定义中间件中。

https://webpack.js.org/configuration/dev-server/#devserverbefore

例如，制作一个extra-webpack.config.js：

module.exports = {
  devServer: {
    before(app, server) {
      app.use(yourCustomMiddleware);
    }
  }
};

然后将其连接angular.json：

"architect": {
  ...
  "build": {
    "builder": "@angular-builders/custom-webpack:browser"
    "options": {
      "customWebpackConfig": {
         path: "./extra-webpack.config.js"
      }