react区分不同生产环境

Posted fyh0912

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了react区分不同生产环境相关的知识,希望对你有一定的参考价值。

react区分不同生产环

  1.  
    if (process.env.NODE_ENV === ‘production‘) {
  2.  
    return `https://****.*****.com/#/dashboard/${row.dashboardId}/show`
  3.  
    } else if (process.env.NODE_ENV === ‘stage‘) {
  4.  
    return `https://*****.st.***.com/#/dashboard/${row.dashboardId}/show`
  5.  
    } else {
  6.  
    return `http://*****.test.****.com/#/dashboard/${row.dashboardId}/show`
  7.  
    }

传统的方法就是通过process.env.NODE_ENV这个参数来区分当前的生产环境,但是我在实际使用的时候却发现,不管是线上还是st还是dev环境,都是给我返回的线上那条url。

后来改用域名来判断当前生产环境,这个要比process.env.NODE_ENV这个参数好用。

  1.  
    let url = window.location.host;
  2.  
    if(url === ‘***.dev.***.com‘ || url === ‘localhost:3030‘ ){
  3.  
    return `http://.***.test.***.com/#/dashboard/${row.dashboardId}/show`
  4.  
    }else if(url === `***.test.***.com`){
  5.  
    return `http://***.***.test.***.com/#/dashboard/${row.dashboardId}/show`
  6.  
    }else if(url === ‘***.st.***.com‘){
  7.  
    return `https://***.***.st.***.com/#/dashboard/${row.dashboardId}/show`
  8.  
    }else if(url === ‘***.***.com‘){
  9.  
    return `https://***.***.com/#/dashboard/${row.dashboardId}/show`
  10.  
    }

以上是关于react区分不同生产环境的主要内容,如果未能解决你的问题,请参考以下文章

VUE打包区分生产和测试环境

vue-cli3区分开发和生产环境

[react] React根据不同的环境打包不同的域名?

Flask 学习-18.配置管理开发/生产/测试环境

React-native:检测开发或生产环境

Unity中的环境变量在开发和生产之间有所不同