Como desenvolver React Native iOS Apps no Windows com Hackintosh (bem, mais ou menos)

Olá Médio! Então essa é minha primeira história, mas eu gostaria de ir direto ao jogo.

Estou meio frustrado por precisar de um Mac e iPhone físico para fazer o desenvolvimento do iOS React Native.

Quero dizer, eu tenho MacBook e iPhone, eu tenho. E eu tive que compartilhar meu repositório no meu MacBook e executar meu React Native Builder e React Native Packager, que é meio detalhado e manco. Vaia.

Além disso, quero trabalhar em uma estação de trabalho, tenho uma estação de trabalho Xeon e é triste ter que dizer adeus ao teclado e mouse e, portanto, adeus à produtividade.

Até a Xamarin ofereceu um simulador iOS remoto e um agente de compilação para que pudéssemos aproveitar o desenvolvimento em nosso PC principal e depois fazer a compilação em nosso ambiente Mac remoto. E duvido que a equipe do RN tivesse a brisa para fazer isso acontecer.

Então, apertei um pouco do poder do meu cérebro e finalmente saí de uma solução, que é muito, muito maluca, louca e preguiçosa. E aqui estão os pontos em que pensei:

O bom 1: ele funciona universalmente, em qualquer PC de x86_64 bits com a virtualização ativada, desde que você tenha seguido as etapas claramente.

The Good 2: você pode descartar o ambiente facilmente. Você também pode clonar um ambiente e movê-lo para outro lugar.

O ruim 1: isso, apenas, funciona!

The Bad 2: Eu não recomendo que você execute outros programas para Mac além do XCode.

O ruim 3: não espere que os processadores AMD funcionem muito sobre isso.

The Ugly 1: Você precisa de um PC monstruoso e robusto para obter apenas uma fração do desempenho em um Mac real.

The Ugly 2: Sem aceleração de hardware, portanto, não espere executar e depurar o contexto do OpenGL ES com ele.

Se você é um homem de verdade, compre um Mac. Caso contrário, agora descobriremos a jornada para Hack-in-to-sh!

(Aviso: a prática do Hackintosh é uma violação do EULA do Apple Software e do Hardware, e você pode enfrentar acusações e ações judiciais, apesar de ninguém ter participado nos últimos 10 anos, mas sim uma empresa, mas não estamos limitados a isso. qualquer coisa com o nosso computador, incluindo a instalação de vários sistemas operacionais, então prepare-se e decida se deseja continuar entrando em uma zona cinza legal)

Pré-requisito

Como mencionei antes, você realmente precisa de um PC muito forte e poderoso! Eu tenho uma estação de trabalho Xeon, mas ela mal funciona bem, imagine que tipo de pesadelo foi fazê-la agitada, não é?

Além disso, você precisa de um SSD, a menos que tenha paciência para aguardar mais de 5 minutos para entrar na sua VM do Mac com o seu HDD.

Espere um minuto! VM. Hmm ... máquina virtual? Você adivinhou, não é? É isso mesmo, precisamos do VMWare para isso.

Etapa 1: buscar a imagem de instalação do Mac

Bem, sem isso, não poderíamos fazer nada ...

Se você tem um amigo que tenha um Mac, peça emprestado sua máquina ...

Faça o download do macOS Sierra da App Store…

Fique on-line e encontre o ritual de copiar essa imagem de instalação no formato DMG / ISO portátil.

Eu não divulgaria esse método, porque não quero ter problemas ~ ¯ \ _ (ツ) _ / ¯

Transfira o arquivo DMG / ISO final para o seu PC principal. Claro que vamos precisar, ou como nós ...

Etapa 2: Baixar o VMWare Player

A menos que você tenha o VMWare Workstation, o que a maioria de nós não possui, teremos que continuar o download do VMWare Player.

Basta instalá-lo. Não deve haver problemas.

Etapa 3: faça o download do Unlocker

Tudo bem, este é o nosso primeiro hack.

Basicamente, o VMWare bloqueou as opções essenciais, impedindo a execução e cooperação de OSX e EFI (hardcode, serial, SMB etc.) em qualquer instância de máquina virtual em todos os hipervisores VMWare, exceto o VMWare Fusion.

Portanto, teremos que "desbloqueá-lo" corrigindo algumas coisas para que o Hackintosh funcione.

Depois de baixar os arquivos clicando em "Clonar ou baixar", descompacte-o e encontre os arquivos denominados "win-install.cmd" e "win-update-tools.cmd".

Clique com o botão direito em 'win-install.cmd' e selecione 'Executar como administrador', o mesmo vale para 'win-update-tools.cmd'. Isso é necessário para obter acesso ao Registro do Windows e interromper os serviços VMWare para executar correções.

Etapa 4: criar uma nova máquina virtual

Abra o VMWare Player e, no menu, selecione Criar uma nova máquina virtual.

Em seguida, selecione o arquivo de imagem do disco de instalação que você acabou de transferir antes.

Em seguida, precisamos selecionar 'Apple Mac OS X' e escolher a versão apropriada. Aqui, por exemplo, estou usando o macOS Sierra, então era o macOS 10.12, se você estiver usando El Capitan ou Yosemite, obtenha a versão correta.

Vá passar todas essas opções. Lembre-se de configurar sua VM, eu mudei as contagens principais, mas na maioria das vezes era bom para a massa.

Etapa 5: Modificando o arquivo .vmx

Teremos que contornar a limitação imposta pelo VMWare que mencionei na Etapa 3. Teremos que adicionar uma entrada ao arquivo de configuração da máquina virtual. Ou você enfrentará um dump principal durante o lançamento da VM.

Por padrão, ele está localizado em '~ / Documents / Virtual Machine / / .vmx' se você não tiver alterado o local.

Abra-o e adicione o seguinte texto no final do arquivo:

smc.version = "0"

Etapa 6: Inicie-me

Uau, que trabalho duro aqui. Agora é hora de começar a instalação.

Não deve haver problemas. Você poderá ver o elegante logotipo da Apple.

(YMMV)

E a tela de seleção de idioma.

Tela de seleção de idioma

Selecione o idioma de sua preferência. Em seguida, precisamos clicar em Utilitários-> Utilitário de Disco. Formate o disco virtual para HFS.

Veja o vídeo: https://puu.sh/w46Pj/a5a7f8ff5d.webm

Então poderíamos prosseguir com a instalação. Geralmente, leva cerca de 20 minutos para fazer isso. Durante a longa espera, prepare e pegue uma xícara de café e espere até o fim. Uma reinicialização automática é agendada após o final e você verá a tela de boas-vindas.

Veja em ação: https://puu.sh/w46Pw/519687fc0d.webm

Etapa 7: Configure-me

A tela de boas-vindas

Conclua-o como costuma fazer com um novo Mac. No entanto, não ative o serviço de localização e ainda não faça login no Apple ID. Não envie dados para a Apple nem aumente a ocultação da nossa configuração do Hackintosh.

Teremos que instalar o VMWare Tools também. Desmonte a unidade do sistema básico OSX no localizador. Em seguida, clique em Player-> Gerenciar-> Instalar o VMWare Tools. Ao instalar isso, você obtém um enorme aumento no desempenho, mas ainda mal corre aos nossos olhos.

Veja isto: https://puu.sh/w4a2m/314480bc99.webm

Parabéns! Agora você tem uma máquina virtual Hackintosh totalmente funcional! Agora, mudaremos para a seção de desenvolvedores ...

Estamos prestes a configurar alguns softwares essenciais do nosso lado do Hackintosh ...

Nós vamos precisar ...

Brew. Claro. Para o NodeJS e NPM e React Native.

Fio para acelerar o tempo de instalação do pacote, a menos que você o compartilhe como eu.

Xcode para compilar o React Native Host.

Etapa 1: instalar o Xcode

Você precisa de um ID da Apple para isso, não o desenvolvedor, o comum é bom.

Veja os vídeos:

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

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

Aguarde até terminar. Não demore muito, você tem um acesso à Internet com fio NAT. Deseja reproduzir o Safari ou outros aplicativos? (Apesar do desempenho horrível)

Etapa 2: Instale o Brew and Node (e Yarn and RN)

Clique no link acima para obter o comando primeiro.

Bem, este deve ser fácil. Como você instalou o VMWare Tools, a área de transferência é bidirecional por padrão, para que você possa copiá-la no lado do Windows e despejá-la no lado do Mac.

Abra o terminal e cole o comando dado pelo Brew. Digite sua senha para permitir a instalação. Tudo será automatizado e deve demorar menos de 10 minutos.

Tome isso como um exemplo: https://puu.sh/w4atb/acbf000b84.webm

(Pressione WinKey + Space para abrir a pesquisa Spotlight, pressione WinKey + V para colar)

Instalando o Node e o NPM:

$ brew install nodejs

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

Instalando o fio:

$ fio de instalação de fermentação

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

Instale o RN:

$ npm -g instala o react-native-cli

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

Etapa 3: Entre no seu projeto

Por enquanto, não copiei meu repo original, mas criei um novo projeto de RN. Se você mudou seu projeto, tudo está configurado perfeitamente.

Você tem duas maneiras de executar seu projeto; Método 1: Vá para a pasta do projeto, clique em ios, abra o xcodeproj, clique no botão executar no Xcode IDE; Método 2: Vá para a pasta do projeto no terminal, digite 'react-native run-ios' e pronto, está pronto.

Etapa final: executar o simulador

Sucesso! Está funcionando perfeitamente! Yay!

Você pode tentar ativar o recarregamento a quente, modificar algum código e ver se ele muda.

Depois disso, tudo deve estar funcionando como um encanto!

Viva! (Lembre-se, tecla Command == tecla Windows)

Não tentei executá-los em dispositivos físicos, mas, em teoria, você só precisa de passagem USB, e o Xcode ou o iTunes devem poder reconhecer seus dispositivos.

Portanto, sem falar na legalidade intermediária, acho que esse Hackintosh é um truque sofisticado para obter o desenvolvimento do iOS no Windows sem comprar um caro Mac Pro / MacBook Pro.

Alguns podem até instalar uma distrubuição real do Hackintosh em hardware bare metal, como os ultrabooks, Dell XPS 15 ou ZenBook, dessa maneira, a mesma coisa pode ser alcançada, mas é mais perigoso e você perde o ambiente do Windows (a menos que a inicialização dupla esteja ativada - A maioria de nós não).

Estou ansioso para ver a equipe do RN lançar um novo kit de ferramentas para desenvolvedores de Mac / Windows para obter uma melhor experiência de desenvolvimento enquanto ainda estiver usando as ferramentas mais confortáveis. Dizem que é uma ideia interessante e aguarda RP.

Duvido que esta seja a minha resposta para isso. De qualquer forma, obrigado por ler este artigo (mais como um tutorial). Com certeza, de alguma forma, será mais fácil. Se você tiver a generosidade de compartilhar sua ideia, faça-o na seção de comentários. Aguardo com expectativa sua reação. Tenha um bom dia com meus hacks!

(Editado em 13/1)

Saudações! Eu acho que já faz muito tempo desde que escrevi isso. Agora, descobri um mundo totalmente novo sobre o desenvolvimento de aplicativos móveis em uma VM Hackintosh. Graças ao recente avanço do React Native e ao explorar a Expo e a conexão somente com host, podemos ter um ambiente de desenvolvimento ainda mais agradável, para que você possa finalmente ter a sua escolha de IDE e servidor de pacote hospedado no Windows.

Isso substituirá a Etapa 3 no tutorial mencionado acima. Também vou apresentar mais um truque para tornar a VM totalmente imersiva no desenvolvimento do iOS.

Basicamente, você só precisa do CRNA e da versão mais recente do Expo / React Native (falando de 0,52 no momento da redação), é isso. Se você tiver um aplicativo existente inicializado no CRNA, ele poderá funcionar perfeitamente.

É muito simples. (Presumo que você usará o Yarn, deve ser semelhante ao NPM) Inicie o empacotador CRNA no Windows, usando o PowerShell ou o CMD:

Início da execução do Windows $ yarn
...
Para visualizar seu aplicativo com recarga ao vivo, aponte o aplicativo Expo para este código QR.
Você encontrará o scanner QR na guia Projetos do aplicativo.

Ou digite este endereço na barra de pesquisa do aplicativo Expo:
exp: // : 19000
Seu telefone precisará estar na mesma rede local que este computador.
Para obter links para instalar o aplicativo Expo, visite https://expo.io.
Os logs da veiculação de seu aplicativo serão exibidos aqui. Pressione Ctrl + C a qualquer momento para parar.
›Pressione a para abrir o dispositivo ou emulador Android.
 ›Pressione q para exibir o código QR.
 ›Pressione r para reiniciar o empacotador ou R para reiniciar o empacotador e limpar o cache.
 ›Pressione d para alternar para o modo de desenvolvimento. (modo atual: desenvolvimento)

Essa será a porta que estamos usando.

Em seguida, tente encontrar o seu endereço de host. (Máquina diferente tem IP diferente, YMMV)

OSXVM $ ifconfig
...
en0: sinalizadores = 8863  mtu 1500
opções = b 
éter 00: 0c: 29: a1: d7: 8e
inet6 fe80 :: cfe: e149: 421e: 601a% en0 prefixo 64 escopo protegido 0x4
inet 192.168.67.128 máscara de rede 0xffffff00 broadcast 192.168.67.255
opções nd6 = 201 
mídia: seleção automática (1000baseT )
status: ativo

Para mim, este é o endereço do host. Mas você precisa descartar o último byte e acrescentar 1.

Portanto, o IP do host aqui é 192.168.67.1. Tome nota disso primeiro.

Em seguida, ativaremos o molho secreto feito pelos engenheiros da Apple.

A partir do XCode 9, criando um diretório simples na raiz do seu Mac HD, você pode acessar o menu interno do iOS Simulator. As versões mais antigas não possuem esse recurso AFAIK.

Feche todos os seus simuladores primeiro. Em seguida, basta digitar isso no seu terminal.

OSXVM $ sudo mkdir / AppleInternal
(Sua senha)

É isso aí! Agora verifique se o menu interno está presente iniciando um simulador e procure pelo seguinte:

Na verdade, isso também é universal para Macs reais! Para obter informações sobre este menu interno, consulte este artigo do Medium. Mas estamos mais focados no modo de tela cheia, que é realmente a razão pela qual você pode trazer seu XCode junto com o simulador em um novo desktop virtual:

Se você teve algum problema de permissão, bem, principalmente usuários do High Sierra, precisará criar esta pasta no Modo de recuperação. Basta clicar em Utilitário e terminal, mas você precisará realocar o Main Mac HD, mas também funcionará.

Agora, procederemos à instalação do Expo Client em (qualquer um dos) ambientes do simulador.

Como essa etapa é muito trivial, recomendo que você leia isso no documento oficial da Expo:

Depois de instalar o aplicativo Expo, abra-o no Simulador.

Em seguida, clique no "Plus" e digite o endereço do host, mas primeiro precisamos formatá-lo para o que a exposição possa reconhecer:

O formato é:

exp: // : 

Então, para mim, isso é: "exp: //192.168.67.1: 19000"

Clique em Abrir e, se vir o pacote sendo criado no lado do PC com Windows Dev, então PARABÉNS, você poderá obter o ambiente do simulador de aplicativos. No entanto, o HMR não está ativado, mas é o Live Reload, por padrão. Se você precisar, vá em Hardware-> Agite o gesto e altere-o.

O último passo é ativar o modo de tela cheia para torná-lo mais imersivo. Se você clicar em um item no menu interno fácil e trivial para você, basta clicar no botão verde de tela cheia.

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

E é isso! Você pode até ter o Genymotion trabalhando ao lado! Este é um grande impulso à produtividade!

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

Esse é o fim da atualização. Espero que você esteja feliz na jornada! A Expo é realmente uma ferramenta poderosa e precisamos valorizá-la. Não existe almoço grátis. Por favor, considere doações para o projeto Expo. Eles estão ansiosos em dinheiro para manter o projeto e pagar seu servidor (compilação)! (Infelizmente eles ainda não ofereceram método para fazer isso)

E, por favor, Apple, não diga ao seu advogado que entre em contato comigo e me envolva em problemas legais.