# ⚠️⚠️⚠️ OBSERVAÇÕES IMPORTANTES ⚠️⚠️⚠️ 🚧 **O seu aparelho deve obrigatoriamente estar na mesma rede do seu servidor.** 🚧 ⚙️ **Será necessário que o projeto já esteja rodando como um _server_!** ⚙️ 📲 **Depois que seguir os passos abaixo pode fechar o Android Studio, e também não é mais necessário fazer o build novamente, quando fizer qualquer alteração no codigo, criar novas telas etc, ao salvar o arquivo o Live Reload enviará para o dispositivo as alterações!** 📲 ----------------------- # 👾 Usando capacitor com Live Reload 👾 ➡️ **1° Vá no 'package.json' e adicione a seguinte linha nos Scripts** `"startServer": "ng serve --port 8100 --host 0.0.0.0 --disable-host-check",` ⚙️ **Será necessário que o projeto já esteja rodando com esse comando acima para continuar os passos abaixo!** ⚙️ ➡️ **2° Encontre seu IP local!** No windows use '`ipconfig`' para saber o seu IP... No Linux use '`ifconfig`. ➡️ **3° Depois de saber o seu IP, edite o arquivo 'capacitor.config.json'** Crie um server se ele não exisir, Subistitua a '0.0.0.0' pelo seu IP e defina a porta que o seu projeto está rodando! ``` "server": { "url": "http://0.0.0.0:8100", "cleartext": true }, ``` ➡️ **4° Rode os comandos fazer o build no seu dispositivo, aguarde o Android Studio finalizar a instalação.** **5° Divirta-se usando o live reload!**** ----------------------- # 🤖 Usando Nx.Dev capacitor com Live Reload 🤖 ➡️ **1° Você precisa instalar os seguintes plugins...** ``` npm i --save-dev ip npm i --save-dev cross-env ``` ➡️ **2° Depois siga o passo 2 descritos anteriormente no tutorial acima.** ➡️ **3° Vá no 'package.json' e adicione ou edite as seguintes linhas nos Scripts** ``` "LIVE_IN_DEVICE": "cross-env LIVE=true", "BUILD_DEV": "nx run your_project:build:development && nx run your_project:sync:android && npm run LIVE_IN_DEVICE nx run your_project:copy:android && nx run your_project:open:android", ``` ➡️ **4° Depois edite o arquivo 'capacitor.config.ts' ( Aqui o sistema ira pegar o IP automaticamente )** Adicione o importe do ip `import ip from 'ip';` No filnal do arquivo antes do export adicione o seguinte codigo. ``` /** * Use for live reload in real device * @author Starley Cazorla */ if (process.env.LIVE === 'true') { const localIp = ip.address(); const port = process.env.PORT || '8100'; config.server = { url: `http://${localIp}:${port}`, cleartext: true }; } else { config.server = { allowNavigation: ["*"], cleartext: true }; } ``` **5° Rode os comandos fazer o build no seu dispositivo, aguarde o Android Studio finalizar a instalação.** **6° Divirta-se usando o live reload!** ``` ❓ Duvidas, sugestões 🪪 Starley Cazorla - Mestre Jedi 📫 starlleycom@gmail.com ```
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter