Framework7 CLI 2.3.0 Released!

Announcements
1

Framework7 CLI 2.3.0 update with all new UI released. It has a lot more options to configure and choose from.

2.3.0 Changelog:

  • All new UI :tada:
    • Now it is possible to change cwd (project destination)
    • Advanced webpack configuration
    • Advanced pre-installed Cordova plugins configuration
    • More theming options with instant theming preview - dark mode, fill-style navigation bars
    • New custom build section (for webpack + Less only)
  • Fixed electron settings file reference
  • Minor fixes

cli
cli.png1600×8400 1.17 MB

6 Likes
9

Super excited about this @vlad. Thanks a lot

10

Hi Vlad, awesome work with the CLI! (and everything else you do in general)

I don’t know if you take requests, but it would be very nice if the CLI could also support creating Typescript projects?

3 Likes
11

Would be awesome to have a .gitignore file added. The CLI creates a big structure, and I am not sure what should be in git or not, particularly after I built a bunch of stuff.

1 Like
13

Yeah, will add default .gitignore

14

This is really awesome! especially for us Designer there need to go into dev :stuck_out_tongue:
I quick question, that the CLI doesnt answer for me:

Is it right that if you wanna work with FW7 + Cordova, you need to install them in two different folder and then merge your FW7 www into the cordova project?

Really dont get the logic of the workflow. I thought the CLI would merge them together but no luck, they overwrite. And when i follow the docs i get:
“Looks like cordova project is not set up”

Otherwise! so great!

/Best Jacob R.

15

What is your CLI config (what did you select) on creation?

16

wow… sorry buddy, I used the CMD and was selecting cordova with RETURN instead of selecting with space and then enter. MY BAD, it works!

once again, thanks for everything!

17

Yeah, also check readme file in created project folder, it should explain some things. But in overall, you shouldn’t touch Cordova/www folder and work only with src folder (if you have bundler) or root www folder (if you haven’t). And when you run Cordova related scripts it should automatically put correct content into Cordova/www

1 Like
18

Почему при выборе необходимых плагинов для Cordova, они не попадают в config.xml? Это баг или так задумано?

19

Видимо так задумано. Последние версии cordov’ы добавляют их в package.json

20

Цитата отсюда: https://github.com/framework7io/framework7-template-webpack
из раздела “Use with Cordova”:

Just put the contents of www folder in your cordova’s project root www folder

Как все же верно?:slight_smile:

21

Мы говорим о CLI, в том шаблоне по другому

22

Подскажите, правильно ли я понимаю оптимальный режим работы с CLI при использовании Cordova (возможно еще кому-то понадобиться):

  1. Весь исходный код мы кладем в src
  2. Для запуска локального сервера нужно выполнить npm start, раньше было npm run dev. Система следит за изменениями файлов и автоматически обновляет страницу. Это очень удобный способ разработки.
  3. Кода нам нужно сделать сборку в один файл мы выполняем npm run build-prod или npm run build-dev Данные команды делают один app.js, который содержит в себе все страницы. Собирать в один файл нужно для веб (так будет гораздо быстрее и удобнее) и для Cordova. Если мы используем современный WKWebView, то стандартный плагин Cordova не умеет загружать локальные файлы, нужно использовать плагин от Ionic или компилировать все в один файл. Разница между двумя командами в том, что последняя не минифицирует и не оптимизирует код, т.е. запуск происходит быстрее.
  4. Для создание приложений на ios и android используются две команды npm run build-cordova-dev и npm run build-cordova-prod Разница между ними такая же, как и написано выше. Есть также еще четыре команды, которые могут делать сборку конкретно для ios или android.
  5. Даже если у нас стоит Android Studio, нам нужно все равно установить отдельно Grandle.
  6. При создании приложения на ios, создается проект для Xcode, которые можно открыть из самого Xcode и сделать сборку. Также создается файл *.app Как здесь поступить оптимальнее для тестирования в симуляторе и создание подписанных приложений?
  7. При создании приложения для Android, создается *.apk, которые можно запустить на эмуляторе. Также вопрос, как оптимальнее запустить в эмуляторе и как удобнее делать подписанные сборки?
23

I’ll answer in English as it maybe useful for others.

Actually CLI installs other WKWebView plugin if Webpack is NOT selected - cordova-plugin-wkwebview-file-xhr assuming you don’t need local requests in this case. Probably it should be installed anyway, will revise it. And i personally prefer this plugin over Ionic’s one as this cordova-plugin-wkwebview-file-xhr plugin doesn’t use so many hacks and virtual server like in Ionic’s plugin.

I am not sure (don’t remember) here. I thing when we install Android studio, it also installs Gradle, no?

I believe you can launch simulator and run app on it with just a single command cordova run ios --emulator command.

For iOS apps signing, i always use XCode directly, it manages all code signing automatically.

I am using build.json + --buildConfig flag https://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html#signing-an-app

24

Hey, I tried to install this tool, but with a bug, I tried always wrong!
λ npm install -g framework7-cli
npm ERR! path C:\Users\Administrator\AppData\Roaming\npm\node_modules\framework7-cli\node_modules\expand-brackets npm ERR! code EEXIST
npm ERR! errno -4075
npm ERR! syscall mkdir
npm ERR! EEXIST: file already exists, mkdir ‘C:\Users\Administrator\AppData\Roaming\npm\node_modules\framework7-cli\node_modules\expand-brackets’
npm ERR! File exists: C:\Users\Administrator\AppData\Roaming\npm\node_modules\framework7-cli\node_modules\expand-brackets
npm ERR! Move it away, and try again.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Administrator\AppData\Roaming\npm-cache_logs\2019-05-08T16_09_19_664Z-debug.log

D:\cmder
λ

25

npm install -g framework7-cli --unsafe-perm=true --allow-root

https://framework7.io/cli/

26

I have tried this method, but still can’t

27

Есть проблема с установкой такого плагина (точнее с тем, чтобы передать переменную): https://github.com/iRapoo/cordova-vk-auth

Если выполнить так:
framework7 cordova plugin add https://github.com/iRapoo/cordova-vk-auth --variable VK_APP_ID=6972823

То будет ошибка:
error: unknown option–variable’`

Чтобы установить плагин, нужно перейти в папку cordova и выполнить то, что и указано в инструкции:
cordova plugin add https://github.com/iRapoo/cordova-vk-auth --variable VK_APP_ID=1234567

1 Like