Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/framework7io/framework7-template-vue-webpack
Deprecated! Framework7 Vue Webpack starter app template with hot-reload & css extraction
https://github.com/framework7io/framework7-template-vue-webpack
android app framework7 ios material mobile template vue vuejs webpack
Last synced: about 1 month ago
JSON representation
Deprecated! Framework7 Vue Webpack starter app template with hot-reload & css extraction
- Host: GitHub
- URL: https://github.com/framework7io/framework7-template-vue-webpack
- Owner: framework7io
- License: mit
- Archived: true
- Created: 2016-12-20T14:18:34.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2019-10-07T09:13:38.000Z (almost 5 years ago)
- Last Synced: 2024-07-09T06:39:26.625Z (2 months ago)
- Topics: android, app, framework7, ios, material, mobile, template, vue, vuejs, webpack
- Language: Vue
- Homepage: https://framework7.io/vue/
- Size: 252 KB
- Stars: 385
- Watchers: 25
- Forks: 136
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# ⛔️ DEPRECATED
**This repo is deprecated and not mainted any more. Use [Framework7-CLI](https://framework7.io/cli/) instead. Please, don't open new issues and don't send any PRs to this repository**
# Framework7 Vue + Webpack App Template
A full-featured Framework7 Vue with Webpack setup with hot-reload & css extraction. Based on [Vue Webpack Boilerplate](https://github.com/vuejs-templates/webpack)
## Usage
### 1. Download this repository
```
git clone https://github.com/framework7io/framework7-template-vue-webpack 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 `/src/fonts/`)
### 3. Run the app
```
npm run dev
```
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
Cordova is not enabled by default, so make sure to remove the comment tags around the `` line in [projectroot]/src/index.html
```
```
It will be added during the build process to Android/iOS.
Just put the contents of `www` folder in your cordova's project root `www` folder
## One command install
```
git clone https://github.com/framework7io/framework7-template-vue-webpack my-app &&
cd my-app &&
npm install &&
npm run dev
```
## Build Setup
``` bash
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for development
npm run build-dev
# build for production with minification
npm run build-prod
```
## Project Structure
* `src/index.html` - main app HTML
* `src/assets` - folder with static assets (images)
* `src/components` - folder with custom `.vue` components
* `src/css` - put custom app CSS styles here. Don't forget to import them in `main.js`
* `src/pages` - app `.vue` pages
* `src/app.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
* `/static/` - folder with extra static assets that will be copied into output folder