Framework7 Vue with Browserify starter app template with hot-reload & css extraction
Switch branches/tags
Nothing to show
Clone or download
Latest commit 9dd3460 Apr 29, 2018
Failed to load latest commit information.
src v2 Jan 29, 2018
www pipeline doesn't wortk without www/js folder, fixed Mar 27, 2018
.babelrc v2 Jan 29, 2018
.editorconfig v2 Jan 29, 2018
.eslintrc Template Dec 22, 2016
.gitignore v2 Jan 29, 2018
LICENSE Initial commit Dec 21, 2016 v2 Jan 29, 2018
package-lock.json Update http-server Jan 29, 2018
package.json Update F7 libs Apr 29, 2018

Framework7 Vue Browserify Template

Framework7 Vue with Browserify starter app template with hot-reload & css extraction. Based on Vue Browserify Boilerplate


1. Download this repository

git clone my-app

Repository will be downloaded into my-app/ folder

2. Instal dependencies

Go to the downloaded repository folder and run:

npm install

This will download latest version of Framework7, Framework7-Vue, Vue and required icon fonts (to /www/fonts/)

3. Run the app

npm run serve

App will be opened in browser at http://localhost:8080/

4. Build app for production

npm run build

The output will be at www/ folder

Use with cordova

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

One command install

git clone my-app &&
cd my-app &&
npm install &&
npm run dev

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

Project Structure

  • src/components - folder with custom .vue components
  • src/pages - app .vue pages
  • src/main.js - main app file where you include/import all required libs and init app
  • src/routes.js - app routes
  • src/app.vue - main app structure/component
  • www/css - app styles, put custom app CSS styles here as well
  • www/css/build.css - Vue components styles will be extracted here on npm run build