🛠 New framework7-cli feedback needed

guillaumebiton · February 6, 2019, 10:07am

ok auto reply :

with this options install could be done :
–unsafe-perm=true --allow-root

insulae · February 6, 2019, 12:05pm

I had the same problem in Linux with the node package of my distro. My solution was to uninstall and use it “portable” with the official node web package. Surely this works with the package of my distro, thanks for the contribution.

nolimits4web · February 7, 2019, 1:26pm

nolimits4web · February 7, 2019, 1:58pm

Hey guys, it is out of beta, so use official CLI docs at https://framework7.io/cli/

insulae · February 7, 2019, 2:56pm

The new website is great!, I like it.

in case you’re interested in knowing, If I do not clean the cache, the site looks bad.

with private browsing it looks perfect, I did not clear the cache if you want to do something about it and want some testing

nolimits4web · February 7, 2019, 3:04pm

Thanks, yeah, I know, already invalidated caches on CDNs but can’t affect user’s browser cache, so will be an issue for a while

guillaumebiton · February 8, 2019, 9:46am

Hi, I try stable one but I need the same option to install it.

nolimits4web · February 8, 2019, 11:56am

Issue can be with your initial node/npm system installation, probably you originally installed with wrong rights

asy · February 9, 2019, 5:28am

Please help me, I have this error when i’m installing framework-cli

=======================================================

C:\Windows\System32>npm install -g framework7-cli
C:\Users\ASY\AppData\Roaming\npm\framework7 -> C:\Users\ASY\AppData\Roaming\npm\node_modules\framework7-cli\index.js

[email protected] install C:\Users\ASY\AppData\Roaming\npm\node_modules\framework7-cli\node_modules\sharp
(node install/libvips && node install/dll-copy && prebuild-install) || (node-gyp rebuild && node install/dll-copy)

info sharp Downloading https://github.com/lovell/sharp-libvips/releases/download/v8.7.0/libvips-8.7.0-win32-x64.tar.gz
C:\Users\ASY\AppData\Roaming\npm\node_modules\framework7-cli\node_modules\sharp\install\libvips.js:78
throw err;
^

Error: getaddrinfo ENOTFOUND github.com github.com:443
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:58:26)

C:\Users\ASY\AppData\Roaming\npm\node_modules\framework7-cli\node_modules\sharp>if not defined npm_config_node_gyp (node “C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin\…\node_modules\node-gyp\bin\node-gyp.js” rebuild ) else (node “C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js” rebuild )
gyp ERR! configure error
gyp ERR! stack Error: Can’t find Python executable “C:\Users\ASY\AppData\Local\Programs\Python\Python37”, you can set the PYTHON env variable.
gyp ERR! stack at PythonFinder.failNoPython (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:484:19)
gyp ERR! stack at PythonFinder. (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:509:16)
gyp ERR! stack at C:\Program Files\nodejs\node_modules\npm\node_modules\graceful-fs\polyfills.js:282:31
gyp ERR! stack at FSReqCallback.oncomplete (fs.js:159:21)
gyp ERR! System Windows_NT 10.0.16299
gyp ERR! command “C:\Program Files\nodejs\node.exe” “C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js” “rebuild”
gyp ERR! cwd C:\Users\ASY\AppData\Roaming\npm\node_modules\framework7-cli\node_modules\sharp
gyp ERR! node -v v11.9.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: (node install/libvips && node install/dll-copy && prebuild-install) || (node-gyp rebuild && node install/dll-copy)
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ASY\AppData\Roaming\npm-cache_logs\2019-02-09T05_19_07_668Z-debug.log

=======================================================

Sketcher_Architect · February 9, 2019, 1:54pm

I have only done a little modification to the css/app.css and js/app.js on a newly installed V4, but when I run “build-prod” I got the errors below. I added an image folder, size is 292 kb, is this considered big? BTW, I installed PWA Cordova, split view, webpack, css.

mtech · February 11, 2019, 3:01pm

Hi,
Congratulation on release of v4.

In most of my projects I used caiobiodere/cordova-template-framework7-vue-webpack
cordova run browser – --lr
cordova run android – --lr
were my two favorite commands. How to achieve it using framework7-cli

Thanks in advance.

Regards

nolimits4web · February 11, 2019, 5:07pm

It is not the error, just a warning, just ignore it

Max · March 10, 2019, 10:07am

Just A Suggestion

In all honesty, I really think the official framework7 templates can now be dropped in favour of framework7-cli. I really think that is the best practice… This will enforce usage of the CLI and reduce on the number of questions and challenges that come with just starting from the templates. Myself, when I used the CLI, It sort of helped me set a better project up than when I had just used the template. Plus, I don’t have to keep cd’ing into the cordova folder every now and again. Things like building an app then copying the contents to cordova www folder are dealt with for you already.

P.S.

I noticed that using

framework7 cordova plugin add ..... [--variable, --save, etc], such flags are not recognised by the CLI. I have to cd into the cordova folder myself and do it from there. Other than that, It is the best!

tiptronic · March 10, 2019, 1:01pm

I was thinking about that too. But I also think there is some room for improvement to make it more flexible (e.g. generate PWA assets, exclude fonts, exclude bundler, generate development-files (not virtual, but an uncompressed non-minified version), include external .js (library)-files, etc…).

While in UI, performance and detail, F7 is the next best thing beside sliced bread on the planet, tooling is unfortunately behind (especially if compared to ionic).

nolimits4web · March 11, 2019, 10:00am

Hey guys!

@Max try to bypass arguments with double dash operator, e.g.:

framework7 cordova plugin add -- --variable FOO=bar

@tiptronic i absolutely don’t mind about improve CLI, can you elaborate the points you have mentioned? What do you mean exactly mean and how do you see them to work?

After large 4.2.0 release with Aurora, i am going to get my hands back to CLI and add all necessary features. Even further i am thinking about to pack it into Electron app in addition to CLI interface, to make it more user friendly and to resolve all the issues that most have with installing it from npm

Max · March 11, 2019, 11:06am

The UI option will be such a cool addition! While I am comfortable with CLI myself, I cant wait to use the UI counterpart. Thanks @nolimits4web.

Erik_Cornelisse · March 11, 2019, 7:14pm

Installing problems with npm is not due to Framework7. I like the current UI installation very much and packing in Electron makes it easier for sure, however I am comfortable with CLI myself. Thanks @nolimits4web

tiptronic · March 12, 2019, 8:19am

Hi @nolimits4web,
I’m currently on travel, but will give some feedback in the next couple of days

tiptronic · March 18, 2019, 11:29am

Hi @nolimits4web

as promised here’s a short summary of things which came to mind when playing with f7cli:

General:

option to include/exclude fonts.
option to embed (other) fonts
option to pre-select ‘dark-theme’
option to create a minimal PWA (no fonts, no extensions, just core -> as small as possible)
option to not-create compiler - ‘.map’ files to save space
If you create a simple web-app (single-view, no bundler), we need a script to compile a production folder with minimal contents.
Right now this is a manual process, by removing everything not needed (otherwise the www-folder has close to 7MB!)
Note: For PWA I mostly use system-fonts and SVG icons, so the redundant fonts are not needed anyway.

Same thing, if you create a simple webapp (or PWA) with bundler. Fonts, map-files, etc… add approx. 3MB to the overall file-size.
Just as a side-note: I played a little (amongst others) with Google’s PWACompat, and was able to get a nicely working PWA in < 100kB. (ok didn’t look as nice as with F7, but anyway ;))

PWA:

option to embed external resources (e.g. somefolder/*.png) to the PWA manifest (for dynamically used assets).
right now, all assets from ‘./assets/’ go into ‘./images/’ of the compiled product. Can’t we just keep the folder-name ‘assets’ or ‘images’, so the dev-folder reflects the structure?
option to create splash-screen from an ‘Universal.png’

Optimize caching/use pre-build framework:

Right now the situation is like this:
running npm build-prod takes ages
it would be really great, if we could specify a certain build, so re-creating a build is getting faster (right now this is a manual process, but would be very comfortable to have this on project creation)

Colors:

the body color in a build pwa is always: background:#fff. It would be nice to allow for a fixed body-color on project-creation.

Build:

also allow debug-build
additionally to npm run build-prod it would be great to have a npm run build-dev. This would be helpful to quickly move (or send out) compiled projects for testing.

Cordova:

add scripts to create iOS and Android separately (for Cordova projects)
npm run build-iOS
npm run build-Android
npm run build-browser
option to pre-define settings and plugins to be installed
option to allow for ‘templates’; that means, I can re-create a project with pre-configured settings and plugins -> this would also be nice for other projects as well.
That way we could add our favorite project setup as a ‘template’ to choose from. (this would also be a nice addition to call from the cli: framework7 create -fromTemplate 'mytemplate')

Bundler:

Right now it is mandatory to use a bundler for anything else than ‘simple web-app’ just using F7-core.
It would be benefical to allow creation of any project (e.g. F7Vue) without the need of using a bundler. This would speed up things e.g. for creating a quick test or prototype.
-> I am aware of the fact that you loose lots of options (e.g. single-file-components)), but for quite some projects this would be perfectly ok. Currently this is a manual process (and not a big deal), but it would be nice to have this option.

Aliases:

This is just something you could mention in your ‘readme’:
Just for convenience, I added a couple of aliasses to my ‘~./bash_profile’
e.g.:

alias f7="framework7"

which makes calling the framework7-cli much more concise:
instead:
framewok7 create --ui
just:
f7 create --ui

or (even) instead:
framework7 create --ui
just:
f7ui

(if you spin that idea further - e.g. when using templates - you could quick setup a project with f7 -t 'mytemplate')

If you need more input, just drop me a note (or leave a reply here).

andy

nolimits4web · March 18, 2019, 2:07pm

Awesome! Thanks for such a detailed feedback Will get to work on CLI after 4.2 release