Cómo desarrollar React Native iOS Apps en Windows con Hackintosh (bueno, más o menos)

Hola medio Esta es mi primera historia, pero me gustaría entrar directamente en el juego.

Estoy un poco frustrado. Necesito una Mac y un iPhone físicos para hacer el desarrollo iOS React Native.

Quiero decir, tengo MacBook y iPhone, lo tengo. Y tuve que compartir mi repositorio en mi MacBook y luego ejecutar mi React Native Builder y React Native Packager, que es un poco detallado y cojo. Abucheo.

Además, quiero trabajar en una estación de trabajo, tengo una estación de trabajo Xeon y es triste que tuve que despedirme de mi teclado y mouse y, por lo tanto, adiós a la productividad.

Incluso Xamarin ofreció un simulador de iOS remoto y un agente de compilación para que pudiéramos disfrutar desarrollando en nuestra PC principal y luego impulsar la compilación en nuestro entorno remoto de Mac. Y dudo que el equipo de RN tenga la brisa para hacer que eso suceda.

Así que exprimí parte de mi poder mental y finalmente salí de una solución, que es muy, muy loca, loca y perezosa. Y aquí están los puntos en los que he pensado:

Lo bueno 1: Funciona universalmente, en cualquier PC x86_64 bit con Virtualización habilitada, dado que ha seguido los pasos claramente.

The Good 2: puede eliminar el medio ambiente fácilmente. También puede clonar un entorno y moverlo a otro lugar.

Lo malo 1: ¡Simplemente funciona!

Lo malo 2: No te recomiendo que ejecutes ningún otro programa de Mac más allá de XCode.

Lo malo 3: no espere que las CPU AMD se ejecuten mucho sobre esto.

The Ugly 1: Necesitas una PC monstruosa y robusta para eso, para obtener solo una fracción del rendimiento en una Mac real.

The Ugly 2: sin aceleración de hardware, así que no esperes ejecutar y depurar el contexto OpenGL ES con él.

Si eres un hombre de verdad, compra una Mac. De lo contrario, ¡ahora descubriremos el viaje a Hack-in-to-sh!

(Advertencia: la práctica de Hackintosh es una violación del EULA tanto del software como del hardware de Apple, y puede enfrentar cargos y demandas, a pesar de que nadie ha estado en los últimos 10 años, pero una empresa sí, pero no estamos limitados a hacerlo cualquier cosa con nuestra computadora, incluida la instalación de varios sistemas operativos, así que prepárese y decida si desea continuar pisando una zona gris legal)

Requisito previo

Como mencioné antes, ¡realmente necesitas una PC muy fuerte y poderosa! Tengo una estación de trabajo Xeon, pero apenas funciona bien, imagina qué tipo de pesadilla fue hacerla funcionar, ¿eh?

Además, necesita un SSD, a menos que tenga la paciencia de esperar más de 5 minutos para ingresar a su Mac VM con su HDD.

¡Espera un minuto! VM. Hmm ... ¿Máquina virtual? ¿Lo has adivinado no? Así es, necesitaremos VMWare para esto.

Paso 1: recupera la imagen de instalación de Mac

Bueno, sin esto no podríamos hacer nada ...

Si tienes un amigo que tiene una Mac, toma prestada su máquina ...

Descarga macOS Sierra desde la App Store ...

Conéctese en línea y encuentre el ritual para extraer esa imagen de instalación en un formulario DMG / ISO portátil.

No revelaría tal método, porque no quiero tener problemas ~ ¯ \ _ (ツ) _ / ¯

Transfiera el archivo DMG / ISO final a su PC principal. Por supuesto que lo necesitaremos, o cómo ...

Paso 2: descargue VMWare Player

A menos que tenga VMWare Workstation, que la mayoría de nosotros no tenemos, entonces tendremos que proceder a descargar VMWare Player.

Solo instálalo. No debería haber ningún problema en absoluto.

Paso 3: Descarga Unlocker

Muy bien, este es nuestro primer truco.

Básicamente, VMWare bloqueó las opciones esenciales que impiden que OSX y EFI se ejecuten y cooperen juntos (código duro, serie, SMB, etc.) en cualquier instancia de máquina virtual en todos los hipervisores VMWare pero VMWare Fusion.

Así que tendremos que "desbloquearlo" parcheando algunas cosas para que Hackintosh funcione.

Después de descargar los archivos haciendo clic en "Clonar o descargar", descomprímalo, busque los archivos denominados "win-install.cmd" y "win-update-tools.cmd".

Haga clic con el botón derecho en "win-install.cmd" y seleccione "Ejecutar como administrador", lo mismo ocurre con "win-update-tools.cmd". Esto es necesario para obtener acceso al Registro de Windows y detener los servicios de VMWare para realizar parches.

Paso 4: crear una nueva máquina virtual

Abra su VMWare Player y, justo en el menú, seleccione Crear una nueva máquina virtual.

Luego seleccione el archivo de imagen de disco del instalador que acaba de transferir antes.

Luego, tendremos que seleccionar "Apple Mac OS X" y elegir la versión adecuada. Aquí, por ejemplo, estoy usando macOS Sierra, así que fue 'macOS 10.12', si estás usando El Capitan o Yosemite, obtén la versión correcta.

Ve a pasar todas esas opciones. Recuerde configurar su VM, cambié los recuentos principales, pero la mayoría de las veces estuvo bien para la masa.

Paso 5: Modificando el archivo .vmx

Tendremos que sortear la limitación impuesta por VMWare que mencioné en el Paso 3. Tendremos que agregar una entrada al archivo de configuración de la máquina virtual. O se enfrentará a un volcado de núcleo durante el lanzamiento de la VM.

De forma predeterminada, se encuentra en ‘~ / Documentos / Máquina virtual / / .vmx’ si no ha cambiado la ubicación.

Ábralo y agregue el siguiente texto al final del archivo:

smc.version = "0"

Paso 6: ponme en marcha

Vaya, qué trabajo tan duro aquí. Ahora es el momento de hacer que la instalación funcione.

♫ Si me pones en marcha nunca pararé ♫

No debería haber problemas en absoluto. Debería poder ver el elegante logotipo de Apple.

(YMMV)

Y la pantalla de selección de idioma.

Pantalla de selección de idioma

Seleccione el idioma propio. Luego tendremos que hacer clic en Utilidades-> Utilidad de disco. Formatee el disco virtual a HFS.

Vea el video de hacerlo: https://puu.sh/w46Pj/a5a7f8ff5d.webm

Entonces podríamos proceder a instalarlo. Por lo general, se tarda unos 20 minutos en hacerlo. Durante la larga espera, prepárate y toma una taza de café y espera hasta el final. Se programa un reinicio automático después del final, y verá la pantalla de bienvenida.

Ver en acción: https://puu.sh/w46Pw/519687fc0d.webm

Paso 7: configúrame

La pantalla de bienvenida

Termine como lo hace normalmente con una nueva Mac. Sin embargo, no habilites el servicio de ubicación y aún no inicies sesión en Apple ID. No envíe ningún dato a Apple, ni tampoco para aumentar la ocultación de nuestra configuración de Hackintosh.

Tendremos que instalar también VMWare Tools. Desmonta la unidad del sistema base OSX en el buscador. Luego haga clic en Player-> Manage-> Install VMWare Tools. Al instalar esto, obtienes un gran impulso en el rendimiento, pero todavía apenas se ejecuta en nuestros ojos.

Vea esto: https://puu.sh/w4a2m/314480bc99.webm

¡Felicidades! ¡Ahora tiene una máquina virtual Hackintosh totalmente funcional en su mano! Ahora pasaremos a la sección de desarrolladores ...

Estamos a punto de configurar algún software esencial en nuestro lado de Hackintosh ...

Necesitaremos ...

Elaborar cerveza. Por supuesto. Para NodeJS y NPM y React Native.

Hilo para acelerar el tiempo de instalación de nuestro paquete a menos que use compartirlo como lo hago yo.

Xcode para compilar React Native Host.

Paso 1: Instalar Xcode

Se requiere una ID de Apple para esto, no, no la del desarrollador, la normal está bien.

Mira los videos:

https://puu.sh/w4b8y/665e3fa868.webm

https://puu.sh/w4b8t/07ceee8b38.webm

Espera hasta que termine. No debería demorar demasiado, tiene un acceso a Internet por cable NAT. ¿Te gustaría jugar Safari u otras aplicaciones? (A pesar del desempeño horrible)

Paso 2: Instalar Brew and Node (y Yarn and RN)

Haga clic en el enlace de arriba para obtener el comando primero.

Bueno, este debería ser fácil. Dado que ha instalado VMWare Tools, el portapapeles es bidireccional de forma predeterminada, por lo que puede copiarlo en su lado de Windows y volcarlo en el lado de Mac.

Abra la terminal y pegue el comando dado por Brew. Ingrese su contraseña para permitir la instalación. Todo será automatizado y debería estar en menos de 10 minutos.

Tome esto como ejemplo: https://puu.sh/w4atb/acbf000b84.webm

(Presione WinKey + Space para abrir la búsqueda de Spotlight, presione WinKey + V para pegar)

Instalación de Nodo y NPM:

$ brew install nodejs

https://puu.sh/w4aOv/f6b6e35234.webm

Instalación de hilo:

$ brew instalar hilo

https://puu.sh/w4aOb/0eb124b1d5.webm

Instalar RN:

$ npm -g instalar react-native-cli

https://puu.sh/w4aSC/5524d0705b.webm

Paso 3: inicia tu proyecto

Por el momento, no he copiado mi repositorio original, sino que he creado un nuevo proyecto RN. Si movió su proyecto, tiene todo perfectamente configurado.

Tiene dos formas de ejecutar su proyecto; Método 1: vaya a la carpeta de su proyecto, haga clic en ios, abra el xcodeproj, haga clic en el botón Ejecutar en el Xcode IDE; Método 2: vaya a la carpeta de su proyecto en la terminal, ingrese "react-native run-ios", y listo, está listo.

Paso final: ejecutar el simulador

¡Éxito! ¡Funciona perfectamente! ¡Hurra!

Podría intentar habilitar la recarga en caliente, modificar algún código y ver si cambia.

Después de eso, ¡todo debería funcionar como un encanto!

¡Hurra! (Recuerde, tecla Comando == tecla Windows)

No he tratado de ejecutarlos en dispositivos físicos, pero en teoría solo necesitas un puerto USB, y Xcode o iTunes deberían poder reconocer tus dispositivos.

Entonces, mucho menos la legalidad intermedia, creo que este Hackintosh es un truco bastante elegante para desarrollar iOS en Windows sin comprar una Mac Pro / MacBook Pro demasiado cara.

Algunos incluso pueden instalar una distribución real de Hackintosh en hardware de metal desnudo como en esos ultrabooks, Dell XPS 15 o ZenBook, de esa manera se puede lograr lo mismo, pero es más peligroso y pierde su entorno de Windows (a menos que tenga habilitado el arranque dual) La mayoría de nosotros no).

Espero con ansias ver al equipo de RN lanzar un nuevo kit de herramientas para desarrolladores de Mac / Windows para obtener una mejor experiencia de desarrollo y al mismo tiempo utilizar las herramientas más cómodas propias. Dicen que es una idea interesante y espera a las relaciones públicas.

Dudo que esta sea mi respuesta a esto. De todos modos, gracias por leer este artículo (más como un tutorial). Seguramente será más fácil, si tienes la generosidad para compartir tu idea, hazlo en la sección de comentarios, espero ver tu reacción. ¡Que tengas un buen día con mis hacks!

(Editado en 13/1)

¡Saludos! Supongo que ha pasado mucho tiempo desde que escribí esto. Ahora, he descubierto un mundo completamente nuevo con respecto al desarrollo de aplicaciones móviles en una VM Hackintosh. Gracias al avance reciente de React Native y al explotar Expo y la conexión solo de host, podemos tener un entorno de desarrollo aún más dulce para que finalmente pueda elegir su IDE y el servidor de paquetes alojados en Windows.

Esto anulará el Paso 3 en el tutorial que mencioné anteriormente. También voy a presentarles un truco más para que la máquina virtual sea totalmente inmersiva para el desarrollo de iOS.

Básicamente, solo necesita CRNA y la última versión de Expo / React Native (hablando de 0.52 en el momento de la escritura), eso es todo. Si tiene una aplicación existente arrancada bajo CRNA, también podría funcionar perfectamente.

Es muy sencillo. (Supongo que usará Yarn, debería ser similar para NPM) Inicie su empaquetador CRNA en Windows, usando PowerShell o CMD:

Inicio de Windows $ Yarn Run
...
Para ver su aplicación con recarga en vivo, apunte la aplicación Expo a este código QR.
Encontrará el escáner QR en la pestaña Proyectos de la aplicación.

O ingrese esta dirección en la barra de búsqueda de la aplicación Expo:
exp: // : 19000
Su teléfono deberá estar en la misma red local que esta computadora.
Para obtener enlaces para instalar la aplicación Expo, visite https://expo.io.
Los registros de servir su aplicación aparecerán aquí. Presione Ctrl + C en cualquier momento para detener.
›Presione a para abrir el dispositivo o emulador de Android.
 ›Presione q para mostrar el código QR.
 ›Presione r para reiniciar el empaquetador, o R para reiniciar el empaquetador y borrar el caché.
 ›Presione d para alternar el modo de desarrollo. (modo actual: desarrollo)

Este va a ser el puerto que estamos usando.

Luego, intente encontrar su dirección de host. (Diferentes máquinas tienen diferentes IP, YMMV)

OSXVM $ ifconfig
...
en0: flags = 8863  mtu 1500
opciones = b 
éter 00: 0c: 29: a1: d7: 8e
inet6 fe80 :: cfe: e149: 421e: 601a% en0 prefixlen 64 secure scopeid 0x4
inet 192.168.67.128 netmask 0xffffff00 broadcast 192.168.67.255
nd6 opciones = 201 
media: autoselect (1000baseT )
Estado: Activo

Para mí, esta es la dirección del host. Pero debe descartar el último byte y agregar 1.

Entonces, la IP del host aquí es 192.168.67.1. Toma nota de ello primero.

Luego, activaremos la salsa secreta hecha por los ingenieros de Apple.

A partir de XCode 9, al crear un directorio simple en la raíz de su Mac HD, puede obtener acceso al menú interno del Simulador de iOS. Las versiones anteriores no tienen esta función AFAIK.

Cierre todos sus simuladores primero. Luego simplemente escriba esto en su terminal.

OSXVM $ sudo mkdir / AppleInternal
(Tu contraseña)

¡Eso es! Ahora verifique si el menú interno está presente iniciando un simulador y busque esto:

En realidad, ¡esto también es universal para las Macs reales! Para obtener información sobre este menú interno, consulte este artículo de Medium. Pero estamos más centrados en el modo de pantalla completa, que en realidad es la razón por la que podría llevar su XCode junto con el simulador en un nuevo escritorio virtual:

Si tuvo algún problema con los permisos, en particular los usuarios de High Sierra, deberá crear esta carpeta en modo de recuperación. Simplemente haga clic en Utilidad y Terminal, pero necesitará reubicar su Main Mac HD, también funcionará.

Ahora, procederemos a instalar Expo Client en (cualquiera de los) entornos de simulador.

Este paso es muy trivial, por lo que le recomiendo que lea esto del documento oficial de la Expo:

Una vez que haya instalado la aplicación Expo, ábrala en el simulador.

Luego, haga clic en "Más" y escriba su dirección de host, pero primero, tendremos que formatearla para que la exposición pueda reconocerla:

El formato es:

exp: // : 

Entonces para mí eso es: "exp: //192.168.67.1: 19000"

Haga clic en abrir, y si ve que el paquete se está construyendo en el lado de la PC de Windows Dev, entonces FELICITACIONES, podrá obtener el entorno del simulador de aplicaciones. Sin embargo, HMR no está activado, pero es Live Reload, de forma predeterminada. Si lo necesita, vaya a Hardware-> Agitar gesto y cámbielo.

El último paso es activar el modo de pantalla completa para hacerlo más inmersivo. Si hacer clic en un elemento del menú interno es fácil y trivial para usted, simplemente haga clic en el botón verde de pantalla completa.

https://giant.gfycat.com/AncientPepperyAdamsstaghornedbeetle.mp4

¡Y eso es! ¡Incluso puedes hacer que Genymotion funcione junto! ¡Esto es un gran impulso para la productividad!

https://giant.gfycat.com/EnergeticUltimateAntlion.mp4

Ese es el final de la actualización. Espero que estés feliz en el viaje! Expo es de hecho una herramienta poderosa y debemos apreciarla. No hay tal cosa como un almuerzo gratis. Por favor considere donaciones para el proyecto Expo. ¡Están ansiosos en dinero para mantener el proyecto y pagar su servidor (de compilación)! (Lamentablemente, no ofrecieron ningún método para hacerlo todavía)

Y por favor, Apple, no le diga a su abogado que se contacte conmigo y me meta en los problemas legales.