Question

根据我是在开发还是制作，我有办法设置网址吗？

目前我有一个包含以下代码的组件：

export default class Search extends Component {
    static async getInitialProps({ query: { location } }) {
        const res = await fetch(
            `http://localhost:3000/api/search?location=${location}`
        )
        const businesses = await res.json()
        return businesses
    }
...
}

我想要一些允许我做以下事情的事情：

export default class Search extends Component {
    static async getInitialProps({ query: { location } }) {
        let res
        if (environment is in developement) {
          res = await fetch(
            `http://localhost:3000/api/search?location=${location}`
          )

        } else if (environment is in production) {
          res = await fetch (
            `https://productionurl.now.sh/api/search?location=${location}`
          )
        }
        const businesses = await res.json()
        return businesses
    }
...
}

Answer 1

您可以使用<ReviseInventoryStatusRequest xmlns="urn:ebay:apis:eBLBaseComponents">环境变量执行此操作。为了获得良好的开发人员体验，请设置如下配置文件：

/config/index.js

NODE_ENV

然后，您可以在整个应用程序中使用const dev = process.env.NODE_ENV !== 'production'; export const server = dev ? 'http://localhost:3000/api' : 'https://productionurl.now.sh/api';方法。

/components/Search.js

getInitialProps

确保在import { server } from '../config'; // ... static async getInitialProps({ query: { location } }) { const res = await fetch(`${server}/search?location=${location}`); const businesses = await res.json(); return businesses; }构建脚本中设置了NODE_ENV变量，该脚本看起来应该是这样的。

的package.json

package.json

Answer 2

是的，就像alex bennett所评论的那样，使用dotenv应该适合你的情况！

要进行设置，

安装dotenv 作为Node.js项目npm install dotenv --save的依赖项，然后在您的应用程序中require('dotenv').config()
在项目的根目录中创建一个名为.env的文件，其中包含您需要的<NAME>/<VALUE>格式的环境变量：{{1} }。
将 MY_ENVIRONMENT=production更改为<VALUE>，如果您从localhost部署，则更改为production
如果设置完毕，您可以非常轻松地检查代码中的加载环境变量，如下所示（来自您的示例）：

development

Answer 3

这是一个关于如何设置开发和生产的示例

const prodConfig = {
  publicRuntimeConfig: {
    API_ENDPOINT: 'http://google.com/api'
  }
}

const devConfig = {
  publicRuntimeConfig: {
    API_ENDPOINT: 'http://localhost:3000/api'
  }
}

module.exports = process.env.NODE_ENV === 'production ? prodConfig : devConfig

基于Next.js上的NODE_ENV的条件URL

3 个答案: