首页 > 其他分享 >#yyds干货盘点#react-native 设置环境变量- react-native-dotenv

#yyds干货盘点#react-native 设置环境变量- react-native-dotenv

时间:2023-11-01 12:32:33浏览次数:32  
标签:yyds NAME APP react env TRYPE native

实现方式

1.安装react-native-dotenv

npm install react-native-dotenv --save
//或者
yarn add react-native-dotenv

2.在你的.babelrc(如果没有新建一个)文件中配置一下设置

简单配置,都使用默认参数
{
  "plugins": [
    ["module:react-native-dotenv"]
  ]
}
定制配置,自定义
{
  "plugins": [
    ["module:react-native-dotenv", {
      "envName": "APP_ENV",
      "moduleName": "@env",
      "path": ".env",
      "blocklist": null,
      "allowlist": null,
      "blacklist": null, // DEPRECATED
      "whitelist": null, // DEPRECATED
      "safe": false,
      "allowUndefined": true,
      "verbose": false
    }]
  ]
}

3.在项目根目录下新建js-modules.d.ts文件,设置

declare module '@env'


4.在项目根目录下新建.env文件,里面可以配置需要的变量,使用key=value的形式

eg:

APP_TRYPE = ZZZ
APP_NAME = AAA

5.使用

import {APP_TRYPE, APP_NAME} from "@env"

console.log('APP_TRYPE:',APP_TRYPE)
输出:APP_TRYPE:ZZZ
console.log('APP_NAME',APP_NAME)
输出:APP_NAME:AAA

标签:yyds,NAME,APP,react,env,TRYPE,native
From: https://blog.51cto.com/u_11365839/8120926

相关文章

  • 无涯教程-React Native - 环境设置
    您需要安装几件事来为ReactNative设置环境。我们将使用OSX作为构建平台。步骤1-安装create-react-native-app在系统中成功安装NodeJS和NPM之后,您可以继续安装create-react-native-app(全局显示如下)。C:\Users\Learnfk>npminstall-gcreate-react-native-app步骤2-创......
  • # yyds干货盘点 # Python自动化办公——3个Excel表格中每个门店物品不同,想要汇总在一
    大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Python自动化办公处理的问题,一起来看看吧。上一篇文章中,我们已经看到了两种解决办法了,这一篇文章我们一起来看看另外一种方法。二、实现过程这里【瑜亮老师】另外再给了一个代码和思路,如下所示:#读取Excel......
  • App开发:Vue Native vs React Native
    随着移动应用开发框架数量的增加,2018年Vue Native的引入让开发者有能力使用Vue.js代码来创建ReactNative移动应用。因为VueNative围绕 React Native包装了Vue.js语法,所以框架非常相似。例如,两者都是跨平台框架,这意味着相同的代码库可以编译为适用于Android和iOS环......
  • React学习笔记15-13-setState同步异步问题
    先说结论:setState处在同步的逻辑中会异步更新状态,更新真实dom。连续调用setState不会连续进行虚拟dom的对比和页面的更新setState处在异步的逻辑中,同步更新状态,更新真实dom。 1.同步状态先看同步状态/*eslint-disablereact/no-direct-mutation-state*/importRea......
  • React Native 页面调试工具 react-native-vdebug
    yarnaddreact-native-vdebugimportReactfrom'react'import{createNativeStackNavigator}from'@react-navigation/native-stack'import{getRouter}from'./config'import{ErrorBoundary}from'../component/light......
  • React Native expo项目设置app顶部的状态栏
       importReactfrom'react'import{createNativeStackNavigator}from'@react-navigation/native-stack'import{getRouter}from'./config'import{ErrorBoundary}from'../component/light'importVDebug,{initT......
  • # yyds干货盘点 #Python自动化办公——3个Excel表格中每个门店物品不同,想要汇总在一起
    大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Python自动化办公处理的问题,一起来看看吧。原始数据如下所示:二、实现过程这里【猫药师Kelly】给了一个代码和思路,如下所示:顺利地解决了粉丝的问题。下一篇文章,我们一起来看看另外一种方法。三、总结大家好,......
  • 彻底搞懂Reactor模型和Proactor模型
    在高性能的I/O设计中,有两个著名的模型:Reactor模型和Proactor模型,其中Reactor模型用于同步I/O,而Proactor模型运用于异步I/O操作。想要了解两种模型,需要了解一些IO、同步异步的基础知识,点击查看服务端的线程模型无论是Reactor模型还是Proactor模型,对于支持多连接的服务器,一般......
  • 使用react-native-drawer,跟着官网配置仍报错,Error: [Reanimated] `valueUnpacker` is
    在使用react-native-drawer组件时,编译项目报错试了许多的方法,最后通过在一篇博客中找到解决方法https://blog.csdn.net/lxyoucan/article/details/121851577因为在使用react-native-drawer时也需要使用react-native-reanimated,需要在babel.config.js增加如下第三行配置,然后重新......
  • java中native源码查找方法
    以Object的hashCode()方法为例:1.下载openjdk源码或从github中查找,这里以github中查找为例;2.GitHub中查找https://github.com/bpupadhyaya/openjdk-8/tree/master/hotspot源码;3.搜索到Object.c源码文件,并查找hashCode字眼,如下所示: 4.由上可知,hashCode方法实际是调用的jvm.c......