Framework7 - Vue - Webpack Cordova Template

[centrual]

Hello Vladimir and Framework7 community;

I made cordova template for framework7 - vue - webpack combination. Please check at: https://github.com/centrual/cordova-template-framework7-vue-webpack

Sample Installation: cordova create test_dir --template cordova-template-framework7-vue-webpack

Commands: You can use any cordova commands. Examples:

  cordova platform (add|rm) (android|ios|browser)
  cordova (run|build|prepare) (android|ios|browser) [-- --live-reload]

Have a great day!

[henninghorn]

Wow, this is amazing, @centrual! Great work!

[centrual]

Thank you @henninghorn 💛

[valnub]

Great work! It might be worth checking out Holly Schinsky's template as well: https://github.com/hollyschinsky/phonegap-template-framework7-vue

Also, I created a blog post about these new templates: https://www.timo-ernst.net/blog/2017/01/15/phonegapcordova-templates-for-vuejs-with-framework7/

[centrual]

I updating the template with webpack-dev-server and hot-reload. Thanks for your blog post! 💛
Umm and we can do this template for phonegap too. Let i check the required changes.

[henninghorn]

I'm looking forward to it, @centrual !

[centrual]

@valnub @henninghorn I updated the code for webpack-dev-server. Just hot module replacement not working, because of that it refreshes page on every change, but everything else is good.

Hot-module-replacement available now! 😄

I added phonegap support and i made lot of changes. Can you check?

Have a great day!

[nolimits4web]

@centrual maybe you can send PR to these pages http://framework7.io/vue/ (button with template link) and http://framework7.io/vue/templates.html with information about your template?

[centrual]

@nolimits4web Okay, i adding immediately 👍 Thank you! 😄

I added PR. Thank you: framework7io/framework7-website#31

[ijry]

how to listen android's backbutton event and handle with this.$router.back();
@centrual

[hazzo]

Sorry but it's not simpler and cleaner to have a cordova folder inside the webpack template and set cordova there? I test it and it works. Just make a symlink of www folder with the dist folder and works great (corodva.js must be imported obviously in the index.html to get access to cordova API. Maybe it could be added on run build script). The only downsize it is that you have to run commands inside the cordova folder.

@centrual I tested your template but I miss npm run dev because it does not trigger cordova run|emulate for hot reloading.

[hazzo]

@nolimits4web forked your webpack template and done slight modifications to add cordova wrapper. I modified slightly your README to explain some little "install" steps. I find your template very organised so I decided to add cordova to keep the neatness ;)
I made this fork for my own purposes and I thought it could help someone.

Webpack + Cordova template fork

Cheers!