ionic2 Tutorial
Iniziare con ionic2
Ricerca…
Osservazioni
Ionic 2 è una tecnologia di sviluppo mobile multipiattaforma. Questo framework è progettato per la creazione di applicazioni mobili ibride e può essere utilizzato anche per applicazioni desktop. È una scrittura una volta, funziona ovunque con la tecnologia. Utilizza tecnologie web come JavaScript / Typescript, Angular 2, HTML e CSS (SCSS / LESS). Le app di Ionic2 funzionano bene su >=android 4.4 , ma tu vuoi eseguire su android 4.1 ad android 4.3 devi usare cross walk .
Installazione o configurazione
Dato che Ionic 2 sta migliorando ogni giorno, ti preghiamo di controllare sempre la documentazione ufficiale per tenere traccia delle ultime modifiche e miglioramenti.
Prerequisiti: Avrai bisogno di NodeJS per costruire progetti Ionic 2. È possibile scaricare e installare il nodo qui e conoscere meglio NPM e pacchetti ionico 2 usa qui .
1. Installazione di Ionic 2
Come Ionic 1, è possibile utilizzare la CLI o la GUI Ionic per creare e testare rapidamente le app direttamente nel browser. Ha anche tutte le funzionalità per funzionare con le tue app Ionic 1, quindi non dovrai cambiare nulla!
Per usare Ionic 2 basta installare ionic da npm:
$ npm install -g ionic
Se si verifica un errore EACCES, seguire le istruzioni qui per fornire al nodo le autorizzazioni necessarie.
2. Creazione della prima app
Una volta installata la CLI, esegui il seguente comando per avviare la tua prima app:
$ ionic start MyIonic2Project
Il modello di schede è utilizzato per impostazione predefinita, ma puoi scegliere un altro modello passando un flag. Per esempio:
$ ionic start MyIonic2Project tutorial
$ cd MyIonic2Project
$ npm install
Questo userà il modello del tutorial .
Per eseguire la tua app, cambia nella directory dei tuoi progetti ed esegui ionic serve -lc :
$ ionic serve -lc
L'opzione -l attiva il live ricaricamento della pagina, il -c visualizza i log della console. Se riscontri problemi nella creazione della tua app, assicurati che il tuo package.json corrisponda a quello della ionic2-app-base
Puoi giocare con la tua nuova app proprio lì nel browser!
3. Costruire su un dispositivo
Puoi anche costruire la tua nuova app su un dispositivo fisico o un emulatore di dispositivo. Avrai bisogno di Cordova per procedere.
Per installare Cordova, eseguire:
$ npm install -g cordova
Consulta i documenti del simulatore iOS per la creazione di applicazioni iOS (NOTA: non è possibile creare su dispositivi iOS o emulatori su qualsiasi sistema operativo diverso da OSX) o i documenti Genymotion per creare un'applicazione Android.
Funzionando sul dispositivo iOS:
Per costruire un'app per iOS, è necessario lavorare su un computer OSX, perché avrai bisogno del framework di cacao per poterlo costruire per iOS, se è il caso devi prima aggiungere la piattaforma a cordova eseguendo il seguente comando:
$ ionic cordova platform add ios
Avrai bisogno di Xcode per compilare su un dispositivo iOS.
Infine, esegui la tua app con il seguente comando:
$ ionic cordova run ios
Funzionando su un dispositivo Android:
I passaggi per Android sono quasi identici. Innanzitutto, aggiungi la piattaforma:
$ ionic cordova platform add android
Quindi installare l' SDK Android che consente di compilare su un dispositivo Android. Sebbene Android SDK sia dotato di un emulatore, è molto lento. Genymotion è molto più veloce. Una volta installato, basta eseguire il seguente comando:
$ ionic cordova run android
E questo è tutto! Congratulazioni per aver creato la tua prima app Ionic 2!
Anche Ionic ha una ricarica live. Quindi, se vuoi sviluppare la tua app e vedere i cambiamenti in atto sull'emulatore / dispositivo, puoi farlo eseguendo i seguenti comandi:
Per iOS:
$ ionic cordova emulate ios -lcs
Fai attenzione, su iOS 9.2.2 il fegato non funziona. Se vuoi lavorare con livereload, modifica il file config.xml aggiungendo quanto segue:
<allow-navigation href="*"/>
Quindi in <platform name="ios"> :
<config-file parent="NSAppTransportSecurity" platform="ios" target="*-Info.plist">
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
</config-file>
Per Android:
$ ionic cordova run android -lcs
l sta per live-reload, c per i log della console e s per i log del server. Questo ti permetterà di vedere se ci sono errori / avvertenze durante l'esecuzione.
Costruire per Windows
Se vuoi costruire il tuo progetto per Windows, devi lavorare su un computer Windows. Per iniziare, installa la piattaforma Windows sul tuo progetto ionic2 eseguendo il seguente comando:
$ionic cordova platform add windows
Quindi esegui il seguente comando:
$ionic cordova run windows
Per eseguire nel browser
$ionic serve
per il browser Chrome controlla il dispositivo. (digitare nella barra degli indirizzi del browser Chrome)
chrome://inspect/#devices