Construcción del entorno React-Native + Idea

Depende de

• Nodo
• Herramienta de línea de comando React Native
• Python2
• JDK 1.8
• Idea

Instalación y configuración

De acuerdo con la comunidad china nativa de reacción

• Tenga en cuenta que la versión de Node debe ser superior a 8.3, la versión de Python debe ser 2.x (3.x no es compatible) y la versión de JDK debe ser 1.8 (actualmente 1.9 y superior no son compatibles). Después de instalar Node, se recomienda configurar imágenes npm para acelerar el proceso posterior (o usar herramientas científicas de Internet).

• ¡No uses cnpm! ¡La ruta del módulo instalado por cnpm es extraña, y el empaquetador no puede reconocerse normalmente!

npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global

Yarn, la herramienta de línea de comandos de React Native (react-native-cli)

• Yarn es una herramienta proporcionada por Facebook para reemplazar npm, que puede acelerar la descarga del módulo de nodo. Las herramientas de línea de comandos de React Native se utilizan para realizar tareas como crear, inicializar, actualizar proyectos y ejecutar empaquetadores.

npm install -g yarn react-native-cli

Después de instalar hilo, también debe configurar la fuente del espejo:

yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global

Después de instalar hilo, puede usar hilo para reemplazar npm. Por ejemplo, use hilo para reemplazar el comando de instalación npm, y use hilo para agregar un nombre de biblioteca de terceros para reemplazar npm install un nombre de biblioteca de terceros.

entorno android

Instalar Android SDK

En idea, puede usar Archivo-> Configuración

• Haga clic en Mostrar detalles del paquete en la página de plataformas del SDK para confirmar la instalación de la plataforma Android 28 y los componentes Intel x86 Atom_64 System Image.
  
• Instale la versión 28.0.3 en SDK Tool-> Android SDK bulid Tool

Configurar variables de entorno

• Configurar la variable de entorno ANDROID_HOME
  React Native necesita comprender la ruta donde se instala su SDK de Android a través de la variable de entorno, para poder compilar normalmente.

• Abra el Panel de control-> Sistema y seguridad-> Sistema-> Configuración avanzada del sistema-> Avanzado-> Variables de entorno-> Nuevo, cree una variable de entorno llamada ANDROID_HOME (variables del sistema y del usuario), señale dónde está su SDK de Android Directorio

• El SDK se instala en el siguiente directorio de forma predeterminada:

c:\Users\你的用户名\AppData\Local\Android\Sdk

• Agregue el directorio de herramientas de plataforma a la variable de entorno Ruta
  Abra el Panel de control-> Sistema y seguridad-> Sistema-> Configuración avanzada del sistema-> Avanzado-> Variables de entorno, seleccione la variable Ruta y luego haga clic en Editar. Haga clic en Nuevo y agregue la ruta del directorio de herramientas de plataforma.
  La ruta predeterminada de este directorio es:

c:\Users\你的用户名\AppData\Local\Android\Sdk\platform-tools

Antes de esto, no habrá demasiados problemas en el proceso de instalación. Después de que algunos recursos deben ser entregados, puede causar que el proyecto falle.

Crea un proyecto nativo de reacción a través de Idea

Cuando crea un proyecto por primera vez para ejecutar, debe descargar la herramienta de construcción Gradle. Debido a restricciones como la velocidad de la red sobre la pared, se producirán errores al descargar a través de Idea, lo que provocará el siguiente error durante el tiempo de ejecución:

Exception in thread "main" java.util.zip.ZipException: 
error in opening zip file

• Se recomienda descargar la versión de Gradle manualmente y colocar el paquete comprimido descargado en el siguiente directorio (no se requiere descompresión manual)

C:\Users\xxxxx\.gradle\wrapper\dists\gradle-4.7-all\4cret0dgl5o3b21weaoncl7ys

Después de que gradle esté instalado correctamente, debe cambiar la dirección del espejo de gradle

• Cree un archivo init.gradle en el directorio de instalación de gradle, el contenido es el siguiente:

allprojects{
    repositories {
        def ALIYUN_REPOSITORY_URL = 'http://maven.aliyun.com/nexus/content/groups/public'
        def ALIYUN_JCENTER_URL = 'http://maven.aliyun.com/nexus/content/repositories/jcenter'
        all { ArtifactRepository repo ->
            if(repo instanceof MavenArtifactRepository){
                def url = repo.url.toString()
                if (url.startsWith('https://repo1.maven.org/maven2')) {
                    project.logger.lifecycle "Repository ${repo.url} replaced by $ALIYUN_REPOSITORY_URL."
                    remove repo
                }
                if (url.startsWith('https://jcenter.bintray.com/')) {
                    project.logger.lifecycle "Repository ${repo.url} replaced by $ALIYUN_JCENTER_URL."
                    remove repo
                }
            }
        }
        maven {
                url ALIYUN_REPOSITORY_URL
            url ALIYUN_JCENTER_URL
        }
    }
}

• Modifique el archivo build.gradle en el directorio del proyecto para cambiar jcenter a solicitud http:

  jcenter(){url 'http://jcenter.bintray.com/'}

Finalmente, conecte el teléfono para abrir el modo de depuración. La primera estimación es de unos 10 minutos.

react-native run-android

OJBK