带有自定义 webPack 配置的 Typescript setupProxy.js

如何解决带有自定义 webPack 配置的 Typescript setupProxy.js

我必须在 typescript React 应用程序的 setupProxy.js 中将标头 Access-Control-Allow-Origin 设置为 *。但我不能。我不确定是否支持打字稿中的 setupProxy.js (ts)。

但我需要它用于微前端应用程序。

这是我的自定义 webpack 配置（使用 react-app-rewired）

module.exports = {
    webpack: (config,env) => {
      config.optimization.runtimeChunk = false;
      config.optimization.splitChunks = {
        cacheGroups: {
          default: false,},};
  
      config.output.filename = "static/js/[name].js";
  
      config.plugins[5].options.filename = "static/css/[name].css";
      config.plugins[5].options.modulefilename = () => "static/css/main.css";
      return config;
    },};

这是我的 src/setupProxy.js

module.exports = (app) => {
    app.use((req,res,next) => {
      res.header("Access-Control-Allow-Origin","*");
      next();
    });
  };

还有我的 npm 脚本

"scripts": {
    "start": "PORT=3031 react-app-rewired start","build": "react-app-rewired build","test": "react-scripts test","eject": "react-scripts eject"
  },

如果有另一种方式来实现我想要的，那就太棒了。

解决方法

糟糕，我使用 CRA 创建了 React 应用程序，然后添加了 TS，正确的做法是使用 npx create-react-app my-app --template typescript