在 http-proxy-middleware 的 setupProxy.js 中反应导入环境生成意外标识符答案

【问题标题】：react import environment in setupProxy.js of http-proxy-middleware generate unexpected identifier在 http-proxy-middleware 的 setupProxy.js 中反应导入环境生成意外标识符
【发布时间】：2020-01-01 19:46:30
【问题描述】：

我需要使用 craco 获得的变量来设置代理 http-proxy-middleware 的目标。我已按照本指南为不同的environments 提供更多配置文件。我有 3 个文件 local.js、development.js 和 production.js，它们由 craco 使用不同的 npm run startlocal、startdevelopment 选择。

在 package.json 我有：

 "scripts": {
        "startlocal": "cross-env CLIENT_ENV=local craco start",
        "startdevelopment": "cross-env CLIENT_ENV=development craco start",
        "startproduction": "cross-env CLIENT_ENV=production craco start",

问题是我想根据我所处的环境更改代理功能，因此使用 http-proxy-middleware 我使用了 guide 所述的 setupProxy.js。如果我从“环境”插入导入环境；在 setupProxy.js 我有错误的意外标识符。

这是 setupProxy.js 的代码：

 import environment from 'environment';
    const proxy = require('http-proxy-middleware');

    module.exports = function(app) {
      app.use(proxy('/api', { target: 'http://localhost:5000/' }));
    };

    this my craco.config.js

    const path = require('path');    

    module.exports = function({ env, paths }) {    
      return {    
        webpack: {   
          alias: {    
            environment: path.join(__dirname, 'src', 'environments',     process.env.CLIENT_ENV)    
          }    
        },    
      };    
    };

npm run startlocal 的控制台输出

意外的标识符
npm 错误！代码生命周期
npm 错误！错误号 1
npm 错误！ seltirmedfront_candidati@0.1.0 startlocal: cross-env CLIENT_ENV=local craco start
npm 错误！退出状态 1
npm 错误！
npm 错误！在 seltirmedfront_candidati@0.1.0 startlocal 脚本中失败。
npm 错误！这可能不是 npm 的问题。上面可能还有额外的日志输出。

我想这个问题与 setupProxy.js 是自动加载的并且在 craco.config.js 之前加载的事实有关，所以它没有那个导入。

【问题讨论】：

标签： reactjs http-proxy-middleware craco

【解决方案1】：

您不需要setupProxy.js 和http-proxy-middleware。

只需将代理添加到您当前的craco.config.js：

module.exports = {
...
    devServer: {
        proxy: {
            '/api': 'http://localhost:5000'
        }
    }
};

有关 devServer 设置的更多信息：https://webpack.js.org/configuration/dev-server/#devserverproxy

【讨论】：