我正在 django 项目中开发一个 react 应用程序,并使用 Django rest 框架连接它们。为了从反应应用程序中进行 API 调用,我使用的是 axios。
现在在我的开发环境中,我显然调用了 localhost URL 来访问 API。为此,我有一个包含 axios 实例的文件:
import axios from "axios";
export const axiosInstance = axios.create({
baseURL: "http://127.0.0.1:8000/api/",
timeout: 60000,
});
显然,我的 API 调用在生产环境中不起作用,因为 URL 与上面的不同。我正在将我的 react 应用程序编译成一个静态文件,该文件包含在我的 django 项目中,所以我认为我不能真正添加任何检查环境的代码。
我的一个想法是我可以在我的项目中包含一个我不会投入生产的文件,然后检查该文件是否存在并在 if 语句中调整 url。但是,我不确定这是否是一个好的解决方案,或者我将如何在纯 Javascript 中实现它。
我很高兴听到对此的任何想法
编辑
在考虑了我的问题之后,它实际上没有任何意义 - 我在提交之前编译我的文件,所以它无论如何都不能是动态的。我真正需要的是一个我在开发中使用的 main.js 文件和另一个我将在生产中使用的文件。但是,我不知道如何实现这一点,因为我没有在生产中捆绑任何文件?也许有一种方法可以始终捆绑两个文件 - 一个带有 localhost url,另一个带有我的生产 url。
我正在使用 django-webpack-loader 应用程序,它告诉我的 django 应用程序将哪个文件加载到 html 文件中。通过访问环境变量,我可以安排更改。但是我如何告诉 webpack 制作两个不同的包呢?