如何在React

Question

我在生产中检索图像的方式为：

src="/dibble_back_end/images/icon.png"

然后通过我的nginx代理：

location /dibble_back_end {
    proxy_pass http://dibble_back_end:4000;
    rewrite ^/dibble_back_end(.*)$ $1 break;
}

问题是在开发上，反应服务器在ExpressJS上而不是在ngInx上运行。我希望基于环境变量能够在生产和开发之间进行切换。

例如

开发：

src="localhost:4000/images/icon.png"

生产：

src="/dibble_back_end/images/icon.png"

Answer 1

您没有提供有关设置的详细信息，但是如果您使用的是Create a React App，则不能使用NODE_ENV environment variable，例如：

const src = process.env.NODE_ENV === 'production' ? "/dibble_back_end/images/icon.png" : "localhost:4000/images/icon.png"

或

const basePath = process.env.NODE_ENV === 'production' ? "/dibble_back_end" : "localhost:4000";
const src = `${src}/images/icon.png`;