const baseConfig = require("./webpack.common");
const { merge } = require("webpack-merge");
const mock = require("../mockData/index");
module.exports = merge(baseConfig(false), {
  mode: "development",
  devtool: "cheap-module-source-map",
  target: "web",
  devServer: {
    hot: "only",
    port: 3030, // 端口号，工作中从3001开始，因此增加1个到3002
    open: true, // 自动打开浏览器
    compress: true, // 开启gzip压缩
    historyApiFallback: true, // history路径在刷新出错时重定向开启
    onBeforeSetupMiddleware: function (devServer) {
      if (!devServer) {
        throw new Error("webpack-dev-server is not defined");
      }
      mock(devServer.app);
      /* devServer.app.get("/some/path", function (req, res) {
       res.json({ custom: "response" });
       }); */
    },
    proxy: {
      // 接口代理
      "/api": {
        // 统一api前缀都代理掉
        target: "http://localhost:8000", // 代理的目标地址
        changeOrigin: true, // 改变来源信息
        pathRewrite: {
          // 因前缀为自己增加，因此重写地址
          "/api": "", // 将前缀去掉
        },
      },
    },
  },
  optimization: {
    chunkIds: "named",
  },
});