angular中自定义webpack配置

用到 @angular-builders/custom-webpack 依赖

安装 custom-webpack

• angular - 8.2.14
• @angular-builders/custom-webpack - 8.4.1

npm i -D @angular-builders/custom-webpack@8.4.1 或者 yarn add @angular-builders/custom-webpack@8.4.1 --dev

调整angular.json

{
  // ...省略配置
  "projects": {
    "project-name": {
      // ...省略配置
      "architect": {
        "build": {
          "builder": "@angular-builders/custom-webpack:browser",
          "options": {
            // ...省略配置
            "customWebpackConfig": {
              "path": "./webpack.config.js"
            }
          },
          // ...省略配置
        },
        "serve": {
          "builder": "@angular-builders/custom-webpack:dev-server",
          // ...省略配置
        },
        // ...省略配置
      }
    }
  },
  // ...省略配置
}

webpack.config.js

module.exports = config => {
  console.log('config === ', config);
  config.devServer = Object.assign(config.devServer, {
    port: 9000,
    before: (app, server, compiler) => {
      app.get('/list', (req, res)=>{
        res.json({ success: true, code: 200, data: [] });
      })
    },
  })
  return config;
}

测试

npm start 运行看端口和mock的数据已经成功运行了