1. Встановлення іонного середовища
Розробка Ionic залежить від середовища Nodejs, тому нам потрібно встановити Nodejs перед розробкою. Завантажити та встановити:Вхід за гіперпосиланням видно.
Після завершення встановлення відкрийте PowerShell і введіть команди вузол -v і npm -v, щоб перевірити успішність встановлення, і якщо повернено номер версії, це означає успішність.
Виконайте у командному рядку PowerShell:
Це потрібно для встановлення cordova та ionic за допомогою менеджера пакетів npm, -g означає глобальну установку, а після глобальної установки можна використовувати команди cordova та ionic у будь-якій директорії PowerShell.
Ви можете зіткнутися з такою помилкою:
2. Створити іонічний проєкт
Офіційний сайт Ionic містить три шаблони проєктів: порожні, вкладки та sideMenu, будь ласка, зверніться:Вхід за гіперпосиланням видно.
Ми створюємо наш додаток за шаблоном вкладок, відкриваємо CD PowerShell у каталозі розробки і виконуємо:
де myApp — назва нашого проєкту
Як показано нижче:
C:\project\android>ionic start myApp tabs
√ Створення каталогу .\myApp — готово!
√ Запуск завантаження та витягування вкладок — завершено!
? Чи хотіли б ви інтегрувати свій новий додаток із Cordova, щоб орієнтуватися на нативні iOS та Android? Так
√ Персоналізація ionic.config.json і package.json — готово!
> іонні інтеграції дозволяють Cordova --quiet
√ Завантаження інтеграції Cordova — завершено!
√ Копіювання файлів інтеграцій у проєкт — виконано!
[Гаразд] Додано інтеграцію Cordova!
Встановлення залежностей може зайняти кілька хвилин.
* IONIC DEVAPP *
Прискоріть розробку за допомогою Ionic DevApp — нашого швидкого мобільного додатку для тестування на пристрої
- Тестування на iOS та Android без нативних SDK
- LiveReload для миттєвих оновлень стилю та JS
️--> Install DevApp:Вхід за гіперпосиланням видно. <--
> npm i
× Виконана команда — не вдалося!
[ПОМИЛКА]
>node-sass@4.9.0встановити C:\project\android\myApp\node_modules\node-sass
> node scripts/install.js
Завантаження бінарного файлу зВхід за гіперпосиланням видно.
Завантаження завершено
Бінарний файл збережений у C:\project\android\myApp\node_modules\node-sass\vendor\win32-x64-57\binding.node
Кешування бінарного файлу в 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
> node lib/post_install.js
>node-sass@4.9.0postinstall C:\project\android\myApp\node_modules\node-sass
> вузлові скрипти/build.js
Бінарний файл знайдено за адресою C:\project\android\myApp\node_modules\node-sass\vendor\win32-x64-57\binding.node
Тестування бінарного режиму
Бінарний варіант — це нормально
npm ЕРР! шлях C:\project\android\myApp\node_modules\fsevents\node_modules
npm ЕРР! код EPERM
npm ЕРР! errno -4048
npm ЕРР! Syscall LSTAT
npm ЕРР! Помилка: EPERM: робота не дозволена, lstat
'C:\project\android\myApp\node_modules\fsevents\node_modules'
npm ЕРР! { Помилка: EPERM: операція не дозволена, lstat
'C:\project\android\myApp\node_modules\fsevents\node_modules'
npm ЕРР! стек: 'Помилка: EPERM: операція не дозволена, lstat
\'C:\\project\\android\\myApp\\node_modules\\fsevents\\node_modules'',
npm ЕРР! errno: -4048,
npm ЕРР! код: 'EPERM',
npm ЕРР! syscall: 'lstat',
npm ЕРР! path: 'C:\\project\\android\\myApp\\node_modules\\fsevents\\node_modules' }
npm ЕРР!
npm ЕРР! Будь ласка, спробуйте знову виконати цю команду як root/адміністратор.
npm ЕРР! Повний журнал цього пробігу можна знайти в:
npm ЕРР! C:\Users\itsvse_pc\AppData\Roaming\npm-cache\_logs\2018-06-19T06_52_38_238Z-debug.log
Сталася помилка,Рішення — запустити cmd як адміністратор, а потім знову виконати наведену вище команду！！
Використовуйте CD, щоб увійти в наш проєкт, а потім виконайте таку команду для запуску сервісу браузера:
Після завершення виконання Ionic автоматично допоможе нам відкрити наш браузер за замовчуванням і перейти на сторінку додатку. Коли браузер відкриває сторінку, Ionic увімкнув режим livereload. Після відкриття ми редагуємо файл у розділі www і зберігаємо його, Ionic повідомить браузер про оновлення сторінки через вебсокет,Нам не потрібно вручну оновлювати сторінку щоразу, коли ми вносимо зміни, і значно підвищили ефективність нашої роботи.
Як показано нижче:
|
Опубліковано 19.06.2018 15:07:03
|
|
|
|
