MagicAPP

MagicAPP, специально разработанный для создания веб-приложений, предназначен для удобного написания кода и создания приложений с отличным пользовательским интерфейсом. Сгенерированный код может быть использован напрямую на мобильных устройствах и в WeChat. С помощью инструментов сборки можно легко преобразовать его в нативное приложение, доступное для загрузки пользователями.

Фреймворк включает в себя полный набор UI и обладает гибкой архитектурой, позволяющей использовать отдельные части независимо или интегрировать их с другими фреймворками и библиотеками. В данный момент фреймворк находится в стадии предварительного просмотра и может претерпеть значительные изменения, поэтому будьте внимательны при использовании.

Основные методы использования:

1. Инициализация зависимостей проекта

Инициализация зависимостей проекта выполняется с помощью следующих команд в корневой директории проекта:

sudo npm install -g gulp cordova webpack

npm install
gulp build

Первая команда устанавливает gulp, cordova и webpack глобально.

Примечание: из-за проблем с доступом в Китае, установка может быть очень медленной. Поэтому рекомендуется установить инструмент nrm, который позволяет использовать китайский репозиторий Taobao для ускорения загрузки:

После установки выполните команду nrm ls. Если отображается что-то похожее на следующее, то установка прошла успешно:

  npm ---- https://registry.npmjs.org/
  cnpm --- http://r.cnpmjs.org/
* taobao - http://registry.npm.taobao.org/
  edunpm - http://registry.enpmjs.org/
  eu ----- http://registry.npmjs.eu/
  au ----- http://registry.npmjs.org.au/
  sl ----- http://npm.strongloop.com/
  nj ----- https://registry.nodejitsu.com/
  pt ----- http://registry.npmjs.pt/

Теперь, выполняя инициализацию, вы значительно сократите время загрузки зависимостей.

2. Описание часто используемых команд

Фреймворк включает следующие часто используемые команды, которые описаны ниже:

gulp clean               ## Удаляет все сгенерированные файлы, обычно используется для очистки проекта
gulp build               ## Собирает весь проект
gulp build -r            ## Собирает проект и сжимает его, обычно используется для публикации проекта. Обратите внимание, что эта команда не включает cordova. 
                            Сгенерированные файлы находятся в директории /app/dist. Для обеспечения чистоты файлов рекомендуется выполнить очистку перед публикацией.

gulp dev-mixin           ## Собирает только часть mixin фреймворка

gulp dev-minjs           ## Собирает только часть minjs фреймворка

gulp dev-magic-css       ## Собирает только CSS файлы части magic фреймворка
gulp dev-magic-js        ## Собирает только JS файлы части magic фреймворка
```gulp dev-magic-vue       ## Компиляция только части фреймворка magic-vue``````markdown
gulp cordova-create      ## Создание окружения Cordova
                          ## Команды для Cordova, смотрите подробное описание в разделе Cordova

3. Команды запуска проекта

Текущий фреймворк интегрирован с функцией livereload, которая позволяет автоматически обновлять браузер при сохранении файлов. Для этого достаточно выполнить следующую команду в корневой директории проекта:

gulp build && gulp serve

После выполнения команды проект будет автоматически скомпилирован, и в браузере откроется страница с предварительным просмотром проекта. Далее можно сосредоточиться на написании кода, не беспокоясь о компиляции файлов и обновлении браузера.

Инициализация Cordova:

Cordova — это набор открытых инструментов, которые позволяют упаковывать HTML5 приложения в исполняемые файлы для мобильных устройств и предоставлять дополнительные функции через плагины, такие как доступ к аппаратным устройствам.

1. Инициализация окружения Cordova

Для инициализации окружения Cordova достаточно выполнить следующую команду в корневой директории проекта:

gulp cordova-create

2. Добавление платформы для компиляции

После создания проекта необходимо добавить платформу для компиляции, используя следующую команду:

gulp cordova-android

или

gulp cordova-ios

Например, для добавления платформы Android выполните следующую команду:

gulp cordova-android

Компиляция и сборка Cordova

1. Сборка файлов

gulp cordova-build-[платформа](android/ios)

Например, для сборки проекта для Android выполните следующую команду:

gulp cordova-build-android

После завершения сборки файлы будут автоматически созданы в директории output в корневой директории проекта.

2. Сборка и установка файлов

gulp cordova-run-[платформа]

Например, для сборки и установки проекта для Android на подключённое устройство выполните следующую команду:

gulp cordova-run-android

Сначала будет выполнена команда сборки, после чего файлы будут автоматически установлены на подключённое устройство.

Конфигурация проекта Cordova

1. Описание принципа

Так как файлы cordova очень большие и большей частью создаются автоматически, нет необходимости и не следует добавлять их в систему контроля версий. Поэтому я использовал подход замены файлов, чтобы выделить конфигурационные файлы.

2. Отношения между директориями (необходимо дополнить...)