[Vuejs]-How to start with Framework7 Vue with material design?

0👍

There are three templates given on the frontpage itself:

  1. boilerplate with webpack
  2. boilerplate with browserify
  3. static

0👍

//IOS:
  require('framework7/dist/css/framework7.material.css');
  require('framework7/dist/css/framework7.material.colors.css');
  require('framework7-icons/css/framework7-icons.css');

//Android:
  require('framework7/dist/css/framework7.ios.css');
  require('framework7/dist/css/framework7.ios.colors.css');
  require('framework7-icons/css/framework7-icons.css');

i have used require you can change it into import statments.

new Vue({
      el: '#app',
      template: '<app/>',
      // Init Framework7 by passing parameters here
      framework7: {
        root: '#app',
        /* Uncomment to enable Material theme: */
        material: true,
        routes: Routes
      },
      // Register App Component
      components: {
        app: App
      }
  })

set material to true for material and for iso set it to false.
that it it will work like charam

0👍

I am not sure I understand you question, framework 7 and material design are different UI libraries et all, you can use both of them in your app, its your choice. Ther eis libraries for vue md design, such as this one

https://vuematerial.io/

Also you can use these boilerplates for f7

https://github.com/pvtallulah/base-vue-f7v2-template f7 v2

https://github.com/pvtallulah/base-vue-f7-webpack-cordova f7 v1

Leave a comment