开发人员在那里, 我在尝试使用 Azure DevOps 在我的 React 项目中设置多个环境时遇到了一个小问题。没有太多关于如何完成这项工作的信息,我可以看到它是正确的。
我想要:
目前我已经在我的 React 应用程序上实现了它:
src > service > JS instance.js > instance
import axios from 'axios'
const instance = axios.create({
baseURL: 'https://xxx-test.azurewebsites.net/api',
// baseURL: 'https://localhost:5001/api',
})
export default instance
我的脚本是这样的,没有改成package.json下的脚本:
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
答案 0 :(得分:0)
添加一个 .env
文件:
REACT_APP_API_URL=https://localhost:5001/api
并修改您的代码:
import axios from 'axios'
import config from './config'
const instance = axios.create({
baseURL: process.env.REACT_APP_API_URL
})
export default instance
现在,在管道中,您需要根据目标环境以不同方式设置 REACT_APP_API_URL
环境变量。您可以为此使用 pipeline variables (因为它们也作为环境变量公开)。在 yaml 中,它可能如下所示:
stages:
- stage: test
variables:
REACT_APP_API_URL: https://xxx-test.azurewebsites.net/api
jobs:
- job: test_job
steps:
- script: npm run build
# then deploy the app however you want
- stage: prod
variables:
REACT_APP_API_URL: https://xxx-prod.azurewebsites.net/api
jobs:
- job: prod_job
steps:
- script: npm run build
# then deploy the app however you want