1. Installation en environnement ionique
Le développement ionique dépend de l’environnement Nodejs, donc il faut installer Nodejs avant le développement. Télécharger et installer :La connexion hyperlientérée est visible. Une fois l’installation terminée, ouvrez PowerShell et entrez les commandes nœuds -v et npm -v pour vérifier que l’installation est réussie, et si le numéro de version est retourné, cela signifie que c’est un succès. Exécuter dans la ligne de commande PowerShell :
Cela consiste à installer Cordova et Ionic via le gestionnaire de paquets npm, -g signifie installation globale, et après installation globale, vous pouvez utiliser les commandes cordova et ionic dans n’importe quel dossier de PowerShell.
Vous pourriez rencontrer l’erreur suivante :
2. Créer un projet ionique
Le site officiel d’Ionic propose trois modèles de projets, des onglets et des menus secondaires, veuillez consulter :La connexion hyperlientérée est visible.
Nous créons notre application à l’aide du modèle tabs, ouvrons le CD PowerShell dans le répertoire développement, et exécutons :
où myApp est le nom de notre projet
Comme montré ci-dessous :
C:\project\android>ionic start myApp tabs √ Création du répertoire .\myApp - c’est fait ! √ Téléchargement et extraction des onglets de départ - c’est fait !
? Souhaitez-vous intégrer votre nouvelle application avec Cordova pour cibler iOS et Android natifs ? Oui √ Personnaliser ionic.config.json et package.json – c’est fait ! > intégrations ioniques permettent le cordoue --silencieux √ Téléchargement de Cordova d’intégration - terminé ! √ Copier les fichiers d’intégration vers le projet - c’est fait ! [OK] Ajout de l’intégration Cordova !
L’installation des dépendances peut prendre plusieurs minutes.
* IONIC DEVAPP *
Accélérez le développement avec Ionic DevApp, notre application mobile rapide de test sur appareil
- Tester sur iOS et Android sans SDK natifs - LiveReload pour des mises à jour instantanées de style et JS
️--> Installer DevApp :La connexion hyperlientérée est visible. <--
> npm i × Commande en cours - échec ! [ERREUR]
>node-sass@4.9.0install C :\project\android\myApp\node_modules\node-sass > scripts de nœuds/install.js
Téléchargement binaire depuisLa connexion hyperlientérée est visible. Téléchargement terminé Enregistrement binaire sur C :\project\android\myApp\node_modules\node-sass\vendor\win32-x64-57\binding.node Mise en cache binaire vers C :\Users\itsvse_pc\AppData\Roaming\npm-cache\node-sass\4.9.0\win32-x64-57_binding.node
>uglifyjs-webpack-plugin@0.4.6postinstall C :\project\android\myApp\node_modules\uglifyjs-webpack-plugin > lib/post_install.js nœud
>node-sass@4.9.0postinstall C :\project\android\myApp\node_modules\node-sass > scripts/build.js
Binaire trouvé sur C :\project\android\myApp\node_modules\node-sass\vendor\win32-x64-57\binding.node Test binaire Le binaire est correct npm ERR ! path C :\project\android\myApp\node_modules\fsevents\node_modules npm ERR ! code EPERM npm ERR ! errno -4048 npm ERR ! syscall lstat npm ERR ! Erreur : EPERM : exploitation non autorisée, lstat 'C :\project\android\monApp node_modules\\fsevents\node_modules' npm ERR ! { Erreur : EPERM : opération non autorisée, lstat 'C :\project\android\monApp node_modules\\fsevents\node_modules' npm ERR ! pile : « Erreur : EPERM : opération non autorisée, lstat \'C :\\project\\android\\myApp\\\node_modules\\fsevents\\\node_modules'', npm ERR ! errno : -4048, npm ERR ! code : 'EPERM', npm ERR ! syscall : 'lstat', npm ERR ! path : 'C :\\project\\android\\myApp\\\node_modules\\fsevents\\node_modules' } npm ERR ! npm ERR ! Veuillez essayer de relancer cette commande en tant que root/Administrator.
npm ERR ! Un journal complet de cette exécution se trouve dans : npm ERR ! C :\Users\itsvse_pc\AppData\Roaming\npm-cache\_logs\2018-06-19T06_52_38_238Z-debug.log Erreur survenue,La solution est d’exécuter cmd en tant qu’administrateur, puis d’exécuter à nouveau la commande ci-dessus!!
Utilisez le CD pour entrer notre projet, puis exécutez la commande suivante pour lancer le service navigateur :
Une fois l’exécution terminée, Ionic nous aide automatiquement à ouvrir notre navigateur par défaut et à aller directement à la page de l’application. Lorsque le navigateur ouvre la page, Ionic a activé le mode livereload pour nous, après l’avoir ouverte, nous modifions le fichier sous www et le sauvegardons, Ionic notifiera le navigateur de rafraîchir la page via le websocket,Nous n’avons pas besoin de rafraîchir la page manuellement à chaque modification, et a grandement amélioré notre efficacité au travail.
Comme montré ci-dessous :
|