├── .github ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── ISSUE_TEMPLATE.md └── PULL_REQUEST_TEMPLATE.md ├── LICENSE ├── README.md └── template ├── .babelrc ├── .editorconfig ├── .eslintignore ├── .eslintrc.js ├── .gitignore ├── .stylintrc ├── README.md ├── build ├── css-utils.js ├── env-utils.js ├── fs-utils.js ├── hot-reload.js ├── script.build.js ├── script.clean.js ├── script.dev.js ├── service-worker-dev.js ├── service-worker-prod.js ├── webpack.base.conf.js ├── webpack.dev.conf.js └── webpack.prod.conf.js ├── config ├── dev.env.js ├── index.js └── prod.env.js ├── package.json ├── src ├── App.vue ├── assets │ └── quasar-logo-full.svg ├── components │ └── Hello.vue ├── index.html ├── main.js ├── router.js ├── statics │ ├── icons │ │ ├── apple-icon-152x152.png │ │ ├── favicon-16x16.png │ │ ├── favicon-32x32.png │ │ ├── icon-192x192.png │ │ ├── icon-512x512.png │ │ └── ms-icon-144x144.png │ ├── manifest.json │ └── quasar-logo.png └── themes │ ├── app.ios.styl │ ├── app.mat.styl │ ├── app.variables.styl │ └── quasar.variables.styl └── templates ├── component.vue ├── layout.vue └── page.vue /.github/CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Code of Conduct 2 | 3 | As contributors and maintainers of this project, we pledge to respect all people who contribute through reporting issues, posting feature requests, updating documentation, submitting pull requests or patches, and other activities. 4 | 5 | We are committed to making participation in this project a harassment-free experience for everyone, regardless of level of experience, gender, gender identity and expression, sexual orientation, disability, personal appearance, body size, race, age, or religion. 6 | 7 | Examples of unacceptable behavior by participants include the use of sexual language or imagery, derogatory comments or personal attacks, trolling, public or private harassment, insults, or other unprofessional conduct. 8 | 9 | Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct. Project maintainers who do not follow the Code of Conduct may be removed from the project team. 10 | 11 | Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by opening an issue or contacting one or more of the project maintainers. 12 | 13 | This Code of Conduct is adapted from the [Contributor Covenant](http://contributor-covenant.org), version 1.0.0, available at [http://contributor-covenant.org/version/1/0/0/](http://contributor-covenant.org/version/1/0/0/) 14 | -------------------------------------------------------------------------------- /.github/CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Quasar Contributing Guide 2 | 3 | Hi! I’m really excited that you are interested in contributing to Quasar. Before submitting your contribution though, please make sure to take a moment and read through the following guidelines. 4 | 5 | - [Code of Conduct](https://github.com/quasarframework/quasar/blob/dev/.github/CODE_OF_CONDUCT.md) 6 | - [Issue Reporting Guidelines](#issue-reporting-guidelines) 7 | - [Pull Request Guidelines](#pull-request-guidelines) 8 | - [Development Setup](#development-setup) 9 | 10 | ## Issue Reporting Guidelines 11 | 12 | - The issue list of this repo is **exclusively** for bug reports and feature requests. Non-conforming issues will be closed immediately. 13 | 14 | - For simple beginner questions, you can get quick answers from [The Gitter chat room](https://gitter.im/quasarframework/Lobby). 15 | 16 | - For more complicated questions, you can use [the official forum](http://forum.quasar-framework.org/). Make sure to provide enough information when asking your questions - this makes it easier for others to help you! 17 | 18 | - Try to search for your issue, it may have already been answered or even fixed in the development branch (`dev`). 19 | 20 | - Check if the issue is reproducible with the latest stable version of Quasar. If you are using a pre-release, please indicate the specific version you are using. 21 | 22 | - It is **required** that you clearly describe the steps necessary to reproduce the issue you are running into. Although we would love to help our users as much as possible, diagnosing issues without clear reproduction steps is extremely time-consuming and simply not sustainable. 23 | 24 | - Use only the minimum amount of code necessary to reproduce the unexpected behavior. A good bug report should isolate specific methods that exhibit unexpected behavior and precisely define how expectations were violated. What did you expect the method or methods to do, and how did the observed behavior differ? The more precisely you isolate the issue, the faster we can investigate. 25 | 26 | - Issues with no clear repro steps will not be triaged. If an issue labeled "need repro" receives no further input from the issue author for more than 5 days, it will be closed. 27 | 28 | - If your issue is resolved but still open, don’t hesitate to close it. In case you found a solution by yourself, it could be helpful to explain how you fixed it. 29 | 30 | - Most importantly, we beg your patience: the team must balance your request against many other responsibilities — fixing other bugs, answering other questions, new features, new documentation, etc. The issue list is not paid support and we cannot make guarantees about how fast your issue can be resolved. 31 | 32 | ## Pull Request Guidelines 33 | 34 | - Checkout a topic branch from the `master` branch and merge back against this branch. 35 | 36 | - Work in the `/template` folder. 37 | 38 | - It's OK to have multiple small commits as you work on the PR - we will let GitHub automatically squash it before merging. 39 | 40 | - If adding new feature: 41 | - Provide convincing reason to add this feature. Ideally you should open a suggestion issue first and have it greenlighted before working on it. 42 | 43 | - If fixing a bug: 44 | - If you are resolving a special issue, add `(fix: #xxxx[,#xxx])` (#xxxx is the issue id) in your PR title for a better release log, e.g. `fix: update entities encoding/decoding (fix #3899)`. 45 | - Provide detailed description of the bug in the PR. Live demo preferred. 46 | 47 | ## Development Setup 48 | 49 | You will need [Node.js](http://nodejs.org) **version 4+** along [NPM](https://docs.npmjs.com/getting-started/installing-node). Read `package.json` and take notice of the scripts you can use. 50 | 51 | After cloning the repo, run this inside the `/template` folder: 52 | 53 | ``` bash 54 | $ npm install 55 | ``` 56 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | 32 | 33 | 34 | ### Software version 35 | 36 | Quasar: 37 | OS: 38 | Node: 39 | NPM: 40 | Browsers: 41 | iOS: 42 | Android: 43 | Any other software related to your bug: 44 | 45 | ### What did you get as the error? 46 | 47 | ### What were you expecting? 48 | 49 | ### What steps did you take, to get the error? 50 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | 5 | 6 | 7 | 8 | 9 | **What kind of change does this PR introduce?** (check at least one) 10 | 11 | - [ ] Bugfix 12 | - [ ] Feature 13 | - [ ] Code style update 14 | - [ ] Refactor 15 | - [ ] Build-related changes 16 | - [ ] Other, please describe: 17 | 18 | **Does this PR introduce a breaking change?** (check one) 19 | 20 | - [ ] Yes 21 | - [ ] No 22 | 23 | If yes, please describe the impact and migration path for existing applications: 24 | 25 | **The PR fulfills these requirements:** 26 | 27 | - [ ] It's submitted to the `dev` branch and _not_ the `master` branch 28 | - [ ] When resolving a specific issue, it's referenced in the PR's title (e.g. `fix: #xxx[,#xxx]`, where "xxx" is the issue number) 29 | - [ ] It's been tested with all Quasar themes 30 | - [ ] It's been tested on a Cordova (iOS, Android) app 31 | - [ ] It's been tested on a Electron app 32 | - [ ] Any necessary documentation has been added or updated [in the docs](https://github.com/quasarframework/quasar-framework.org/tree/master/source) (for faster update click on "Suggest an edit on GitHub" at bottom of page) or explained in the PR's description. 33 | 34 | If adding a **new feature**, the PR's description includes: 35 | - [ ] A convincing reason for adding this feature (to avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it) 36 | 37 | **Other information:** 38 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 Razvan Stoenescu 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![Quasar Framework logo](https://cdn.rawgit.com/quasarframework/quasar-art/863c14bd/dist/svg/quasar-logo-full-inline.svg) 2 | 3 | # Quasar Framework PWA App Template 4 | > [PWA](https://developers.google.com/web/progressive-web-apps/) Starter Kit for a Quasar Framework Project. Compatible with Quasar v0.14 ONLY. 5 | 6 | Based on the work of Addy Osmani (https://github.com/vuejs-templates/pwa). 7 | 8 | > **DEPRECATED FOR v0.15+** 9 | 10 | ## Usage 11 | Use Quasar CLI to generate a new project using this template: 12 | 13 | ``` bash 14 | # install Quasar CLI if you don't have it already 15 | $ npm install -g quasar-cli 16 | 17 | # generate a project folder with this template 18 | $ quasar init pwa my-project 19 | 20 | $ cd my-project 21 | $ npm install 22 | $ quasar dev 23 | ``` 24 | 25 | > Important! Do not use Quasar wrappers (Cordova/Electron) on top of this template. 26 | 27 | ## Documentation 28 | 29 | - This template builds on top of the main/default Quasar webpack template. 30 | 31 | - Check out the [official Quasar guide](http://quasar-framework.org/guide/) for general information about Quasar that is not specific to this template. 32 | 33 | ## What's Included 34 | 35 | * Service Worker precaching of application shell + static assets (prod) 36 | * Script (async chunk) preloading using `` 37 | * Web Application Manifest + favicons 38 | * Mobile-friendly meta-viewport 39 | * Lighthouse score of 90+/100 40 | 41 | - `$ quasar dev`: first-in-class development experience. 42 | - Webpack + `vue-loader` for single file Vue components. 43 | - State preserving hot-reload 44 | - State preserving compilation error overlay 45 | - Lint-on-save with ESLint 46 | - Source maps 47 | 48 | - `$ quasar build`: Production ready build. 49 | - JavaScript minified with [UglifyJS](https://github.com/mishoo/UglifyJS2). 50 | - HTML minified with [html-minifier](https://github.com/kangax/html-minifier). 51 | - CSS across all components extracted into a single file and minified with [cssnano](https://github.com/ben-eb/cssnano). 52 | - All static assets compiled with version hashes for efficient long-term caching, and a production `index.html` is auto-generated with proper URLs to these generated assets. 53 | - Use `npm run build --report`to build with bundle size analytics. 54 | - Generates a Service Worker for offline caching your static assets using [sw-precache-webpack-plugin](https://www.npmjs.com/package/sw-precache-webpack-plugin) 55 | 56 | # Quasar Framework 57 | > Build responsive websites, PWAs, hybrid mobile Apps (that look native!) and Electron apps using same code, powered with Vue. 58 | 59 | 60 | 61 | ## Supporting Quasar 62 | Quasar Framework is an MIT-licensed open source project. Its ongoing development is made possible thanks to the support by these awesome [backers](https://github.com/rstoenescu/quasar-framework/blob/dev/backers.md). If you'd like to join them, check out [Quasar Framework's Patreon campaign](https://www.patreon.com/quasarframework). 63 | 64 | ## Community Forum 65 | 66 | Head on to the official community forum: [http://forum.quasar-framework.org](http://forum.quasar-framework.org) 67 | 68 | ## Quasar Repositories 69 | 70 | * [Quasar Framework](https://github.com/quasarframework/quasar) 71 | * [Quasar CLI](https://github.com/quasarframework/quasar-cli) 72 | * [Quasar Play App](https://github.com/quasarframework/quasar-play) 73 | 74 | ## Contributing 75 | 76 | I'm excited if you want to contribute to Quasar under any form (report bugs, write a plugin, fix an issue, write a new feature). 77 | 78 | ### Issue Reporting Guidelines 79 | 80 | **Please use the appropriate Github repo to report issues. See "Related Components" above.** For example, a bug related to CLI should be reported to the CLI repo, one related to build issues to Quasar Framework Templates repo and so on. 81 | 82 | - The issue list of the repository is **exclusively** for bug reports and feature requests. For anything else please use the [Community Forum](http://forum.quasar-framework.org). 83 | 84 | - Try to search for your issue, it may have already been fixed in the development branch or it may have a resolution. 85 | 86 | - Check if the issue is reproducible with the latest stable version of Quasar. If you are using a pre-release, please indicate the specific version you are using. 87 | 88 | - It is **required** that you clearly describe the steps necessary to reproduce the issue you are running into. Issues with no clear repro steps will not be triaged. If an issue labeled "need repro" receives no further input from the issue author for more than 5 days, it will be closed. 89 | 90 | - If your issue is resolved but still open, don’t hesitate to close it. In case you found a solution by yourself, it could be helpful to explain how you fixed it. 91 | 92 | Read more [here](http://quasar-framework.org/guide/contributing.html). 93 | 94 | ## License 95 | 96 | Copyright (c) 2016-2017 Razvan Stoenescu 97 | 98 | [MIT License](http://en.wikipedia.org/wiki/MIT_License) 99 | -------------------------------------------------------------------------------- /template/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [["es2015", {"modules": false}], "stage-2"], 3 | "plugins": ["transform-runtime"], 4 | "comments": false 5 | } 6 | -------------------------------------------------------------------------------- /template/.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | -------------------------------------------------------------------------------- /template/.eslintignore: -------------------------------------------------------------------------------- 1 | build/*.js 2 | config/*.js 3 | dist/*.js 4 | -------------------------------------------------------------------------------- /template/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parser: 'babel-eslint', 4 | parserOptions: { 5 | sourceType: 'module' 6 | }, 7 | env: { 8 | browser: true 9 | }, 10 | // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style 11 | extends: [ 12 | 'standard' 13 | ], 14 | // required to lint *.vue files 15 | plugins: [ 16 | 'html', 17 | 'import' 18 | ], 19 | globals: { 20 | 'cordova': true, 21 | 'DEV': true, 22 | 'PROD': true, 23 | '__THEME': true 24 | }, 25 | // add your custom rules here 26 | 'rules': { 27 | // allow paren-less arrow functions 28 | 'arrow-parens': 0, 29 | 'one-var': 0, 30 | 'import/first': 0, 31 | 'import/named': 2, 32 | 'import/namespace': 2, 33 | 'import/default': 2, 34 | 'import/export': 2, 35 | // allow debugger during development 36 | 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, 37 | 'brace-style': [2, 'stroustrup', { 'allowSingleLine': true }] 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /template/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | .thumbs.db 3 | node_modules/ 4 | dist/ 5 | npm-debug.log* 6 | cordova/platforms 7 | cordova/plugins 8 | -------------------------------------------------------------------------------- /template/.stylintrc: -------------------------------------------------------------------------------- 1 | { 2 | "blocks": "never", 3 | "brackets": "never", 4 | "colons": "never", 5 | "colors": "always", 6 | "commaSpace": "always", 7 | "commentSpace": "always", 8 | "cssLiteral": "never", 9 | "depthLimit": false, 10 | "duplicates": true, 11 | "efficient": "always", 12 | "extendPref": false, 13 | "globalDupe": true, 14 | "indentPref": 2, 15 | "leadingZero": "never", 16 | "maxErrors": false, 17 | "maxWarnings": false, 18 | "mixed": false, 19 | "namingConvention": false, 20 | "namingConventionStrict": false, 21 | "none": "never", 22 | "noImportant": false, 23 | "parenSpace": "never", 24 | "placeholder": false, 25 | "prefixVarsWithDollar": "always", 26 | "quotePref": "single", 27 | "semicolons": "never", 28 | "sortOrder": false, 29 | "stackedProperties": "never", 30 | "trailingWhitespace": "never", 31 | "universal": "never", 32 | "valid": true, 33 | "zeroUnits": "never", 34 | "zIndexNormalize": false 35 | } 36 | -------------------------------------------------------------------------------- /template/README.md: -------------------------------------------------------------------------------- 1 | # Quasar PWA App 2 | 3 | > A Quasar PWA project 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | $ npm install 10 | 11 | # serve with hot reload at localhost:8081 12 | $ quasar dev 13 | 14 | # build for production with minification 15 | $ quasar build 16 | 17 | # lint code 18 | $ quasar lint 19 | ``` 20 | -------------------------------------------------------------------------------- /template/build/css-utils.js: -------------------------------------------------------------------------------- 1 | var 2 | ExtractTextPlugin = require('extract-text-webpack-plugin'), 3 | autoprefixer = require('autoprefixer'), 4 | purify = require('purify-css'), 5 | glob = require('glob'), 6 | path = require('path'), 7 | fs = require('fs') 8 | 9 | module.exports.postcss = [autoprefixer()] 10 | 11 | module.exports.styleLoaders = function (options) { 12 | options = options || {} 13 | 14 | function generateLoaders (loaders) { 15 | if (options.postcss) { 16 | loaders.splice(1, 0, 'postcss') 17 | } 18 | 19 | var sourceLoader = loaders.map(function (loader) { 20 | var extraParamChar 21 | if (/\?/.test(loader)) { 22 | loader = loader.replace(/\?/, '-loader?') 23 | extraParamChar = '&' 24 | } 25 | else { 26 | loader = loader + '-loader' 27 | extraParamChar = '?' 28 | } 29 | return loader + (options.sourceMap ? extraParamChar + 'sourceMap' : '') 30 | }).join('!') 31 | 32 | if (options.extract) { 33 | return ExtractTextPlugin.extract({ 34 | use: sourceLoader, 35 | fallback: 'vue-style-loader' 36 | }) 37 | } 38 | else { 39 | return ['vue-style-loader', sourceLoader].join('!') 40 | } 41 | } 42 | 43 | return { 44 | css: generateLoaders(['css']), 45 | less: generateLoaders(['css', 'less']), 46 | sass: generateLoaders(['css', 'sass?indentedSyntax']), 47 | scss: generateLoaders(['css', 'sass']), 48 | styl: generateLoaders(['css', 'stylus']), 49 | stylus: generateLoaders(['css', 'stylus']) 50 | } 51 | } 52 | 53 | module.exports.styleRules = function (options) { 54 | var output = [] 55 | var loaders = exports.styleLoaders(options) 56 | for (var extension in loaders) { 57 | var loader = loaders[extension] 58 | output.push({ 59 | test: new RegExp('\\.' + extension + '$'), 60 | loader: loader 61 | }) 62 | } 63 | return output 64 | } 65 | 66 | function getSize (size) { 67 | return (size / 1024).toFixed(2) + 'kb' 68 | } 69 | 70 | module.exports.purify = function(cb) { 71 | var css = glob.sync(path.join(__dirname, '../dist/**/*.css')) 72 | var js = glob.sync(path.join(__dirname, '../dist/**/*.js')) 73 | 74 | Promise.all(css.map(function (file) { 75 | return new Promise(function (resolve) { 76 | console.log('\n Purifying ' + path.relative(path.join(__dirname, '../dist'), file).bold + '...') 77 | purify(js, [file], {minify: true}, function (purified) { 78 | var oldSize = fs.statSync(file).size 79 | fs.writeFileSync(file, purified) 80 | var newSize = fs.statSync(file).size 81 | 82 | console.log( 83 | ' * Reduced size by ' + ((1 - newSize / oldSize) * 100).toFixed(2) + '%, from ' + 84 | getSize(oldSize) + ' to ' + getSize(newSize) + '.' 85 | ) 86 | resolve() 87 | }) 88 | }) 89 | })) 90 | .then(cb) 91 | } 92 | -------------------------------------------------------------------------------- /template/build/env-utils.js: -------------------------------------------------------------------------------- 1 | var 2 | config = require('../config'), 3 | theme = process.argv[2] || config.defaultTheme 4 | 5 | module.exports = { 6 | dev: process.env.NODE_ENV === 'development', 7 | prod: process.env.NODE_ENV === 'production', 8 | 9 | platform: { 10 | theme: theme, 11 | cordovaAssets: './cordova/platforms/' + (theme === 'mat' ? 'android' : 'ios') + '/platform_www' 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /template/build/fs-utils.js: -------------------------------------------------------------------------------- 1 | var fs = require('fs') 2 | var UglifyJS = require('uglify-es') 3 | 4 | module.exports = { 5 | loadMinified: function (filePath) { 6 | var code = fs.readFileSync(filePath, 'utf-8') 7 | var result = UglifyJS.minify(code) 8 | if (result.error) { 9 | return '' 10 | } 11 | return result.code 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /template/build/hot-reload.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | require('eventsource-polyfill') 3 | require('webpack-hot-middleware/client?noInfo=true&reload=true') 4 | -------------------------------------------------------------------------------- /template/build/script.build.js: -------------------------------------------------------------------------------- 1 | process.env.NODE_ENV = 'production' 2 | 3 | require('colors') 4 | 5 | var 6 | path = require('path'), 7 | env = require('./env-utils'), 8 | css = require('./css-utils'), 9 | config = require('../config'), 10 | webpack = require('webpack'), 11 | webpackConfig = require('./webpack.prod.conf'), 12 | targetPath = path.join(__dirname, '../dist') 13 | 14 | console.log(' WARNING!'.bold) 15 | console.log(' Do NOT use VueRouter\'s "history" mode if') 16 | console.log(' building for Cordova or Electron.\n') 17 | 18 | require('./script.clean.js') 19 | console.log((' Building Quasar App with "' + env.platform.theme + '" theme...\n').bold) 20 | 21 | function finalize () { 22 | console.log(( 23 | '\n Build complete with "' + env.platform.theme.bold + '" theme in ' + 24 | '"/dist"'.bold + ' folder.\n').cyan) 25 | 26 | console.log(' Built files are meant to be served over an HTTP server.'.bold) 27 | console.log(' Opening index.html over file:// won\'t work.'.bold) 28 | } 29 | 30 | webpack(webpackConfig, function (err, stats) { 31 | if (err) throw err 32 | 33 | process.stdout.write(stats.toString({ 34 | colors: true, 35 | modules: false, 36 | children: false, 37 | chunks: false, 38 | chunkModules: false 39 | }) + '\n') 40 | 41 | if (stats.hasErrors()) { 42 | process.exit(1) 43 | } 44 | 45 | if (config.build.purifyCSS) { 46 | css.purify(finalize) 47 | } 48 | else { 49 | finalize() 50 | } 51 | }) 52 | -------------------------------------------------------------------------------- /template/build/script.clean.js: -------------------------------------------------------------------------------- 1 | var 2 | shell = require('shelljs'), 3 | path = require('path') 4 | 5 | shell.rm('-rf', path.resolve(__dirname, '../dist/*')) 6 | shell.rm('-rf', path.resolve(__dirname, '../dist/.*')) 7 | console.log(' Cleaned build artifacts.\n') 8 | -------------------------------------------------------------------------------- /template/build/script.dev.js: -------------------------------------------------------------------------------- 1 | process.env.NODE_ENV = 'development' 2 | 3 | require('colors') 4 | 5 | var 6 | path = require('path'), 7 | express = require('express'), 8 | webpack = require('webpack'), 9 | env = require('./env-utils'), 10 | config = require('../config'), 11 | opn = require('opn'), 12 | proxyMiddleware = require('http-proxy-middleware'), 13 | webpackConfig = require('./webpack.dev.conf'), 14 | app = express(), 15 | port = process.env.PORT || config.dev.port, 16 | uri = 'http://localhost:' + port 17 | 18 | console.log(' Starting dev server with "' + (process.argv[2] || env.platform.theme).bold + '" theme...') 19 | console.log(' Will listen at ' + uri.bold) 20 | if (config.dev.openBrowser) { 21 | console.log(' Browser will open when build is ready.\n') 22 | } 23 | 24 | var compiler = webpack(webpackConfig) 25 | 26 | // Define HTTP proxies to your custom API backend 27 | // https://github.com/chimurai/http-proxy-middleware 28 | var proxyTable = config.dev.proxyTable 29 | 30 | var devMiddleware = require('webpack-dev-middleware')(compiler, { 31 | publicPath: webpackConfig.output.publicPath, 32 | quiet: true 33 | }) 34 | 35 | var hotMiddleware = require('webpack-hot-middleware')(compiler, { 36 | log: function () {} 37 | }) 38 | 39 | // force page reload when html-webpack-plugin template changes 40 | compiler.plugin('compilation', function (compilation) { 41 | compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) { 42 | hotMiddleware.publish({ action: 'reload' }) 43 | cb() 44 | }) 45 | }) 46 | 47 | // proxy requests like API. See /config/index.js -> dev.proxyTable 48 | // https://github.com/chimurai/http-proxy-middleware 49 | Object.keys(proxyTable).forEach(function (context) { 50 | var options = proxyTable[context] 51 | if (typeof options === 'string') { 52 | options = { target: options } 53 | } 54 | app.use(proxyMiddleware(context, options)) 55 | }) 56 | 57 | // handle fallback for HTML5 history API 58 | app.use(require('connect-history-api-fallback')()) 59 | 60 | // serve webpack bundle output 61 | app.use(devMiddleware) 62 | 63 | // enable hot-reload and state-preserving 64 | // compilation error display 65 | app.use(hotMiddleware) 66 | 67 | // serve pure static assets 68 | var staticsPath = path.posix.join(webpackConfig.output.publicPath, 'statics/') 69 | app.use(staticsPath, express.static('./src/statics')) 70 | 71 | // try to serve Cordova statics for Play App 72 | app.use(express.static(env.platform.cordovaAssets)) 73 | 74 | module.exports = app.listen(port, function (err) { 75 | if (err) { 76 | console.log(err) 77 | process.exit(1) 78 | } 79 | 80 | // open browser if set so in /config/index.js 81 | if (config.dev.openBrowser) { 82 | devMiddleware.waitUntilValid(function () { 83 | opn(uri) 84 | }) 85 | } 86 | }) 87 | -------------------------------------------------------------------------------- /template/build/service-worker-dev.js: -------------------------------------------------------------------------------- 1 | // This service worker file is effectively a 'no-op' that will reset any 2 | // previous service worker registered for the same host:port combination. 3 | // In the production build, this file is replaced with an actual service worker 4 | // file that will precache your site's local assets. 5 | // See https://github.com/facebookincubator/create-react-app/issues/2272#issuecomment-302832432 6 | 7 | self.addEventListener('install', () => self.skipWaiting()); 8 | 9 | self.addEventListener('activate', () => { 10 | self.clients.matchAll({ type: 'window' }).then(windowClients => { 11 | for (let windowClient of windowClients) { 12 | // Force open pages to refresh, so that they have a chance to load the 13 | // fresh navigation response from the local dev server. 14 | windowClient.navigate(windowClient.url); 15 | } 16 | }); 17 | }); -------------------------------------------------------------------------------- /template/build/service-worker-prod.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 'use strict'; 3 | 4 | // Check to make sure service workers are supported in the current browser, 5 | // and that the current page is accessed from a secure origin. Using a 6 | // service worker from an insecure origin will trigger JS console errors. 7 | const isLocalhost = Boolean(window.location.hostname === 'localhost' || 8 | // [::1] is the IPv6 localhost address. 9 | window.location.hostname === '[::1]' || 10 | // 127.0.0.1/8 is considered localhost for IPv4. 11 | window.location.hostname.match( 12 | /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/ 13 | ) 14 | ); 15 | 16 | window.addEventListener('load', function() { 17 | if ('serviceWorker' in navigator && 18 | (window.location.protocol === 'https:' || isLocalhost)) { 19 | navigator.serviceWorker.register('service-worker.js') 20 | .then(function(registration) { 21 | // updatefound is fired if service-worker.js changes. 22 | registration.onupdatefound = function() { 23 | // updatefound is also fired the very first time the SW is installed, 24 | // and there's no need to prompt for a reload at that point. 25 | // So check here to see if the page is already controlled, 26 | // i.e. whether there's an existing service worker. 27 | if (navigator.serviceWorker.controller) { 28 | // The updatefound event implies that registration.installing is set 29 | const installingWorker = registration.installing; 30 | 31 | installingWorker.onstatechange = function() { 32 | switch (installingWorker.state) { 33 | case 'installed': 34 | // At this point, the old content will have been purged and the 35 | // fresh content will have been added to the cache. 36 | // It's the perfect time to display a "New content is 37 | // available; please refresh." message in the page's interface. 38 | break; 39 | 40 | case 'redundant': 41 | throw new Error('The installing ' + 42 | 'service worker became redundant.'); 43 | 44 | default: 45 | // Ignore 46 | } 47 | }; 48 | } 49 | }; 50 | }).catch(function(e) { 51 | console.error('Error during service worker registration:', e); 52 | }); 53 | } 54 | }); 55 | })(); 56 | -------------------------------------------------------------------------------- /template/build/webpack.base.conf.js: -------------------------------------------------------------------------------- 1 | var 2 | path = require('path'), 3 | webpack = require('webpack'), 4 | config = require('../config'), 5 | cssUtils = require('./css-utils'), 6 | env = require('./env-utils'), 7 | merge = require('webpack-merge'), 8 | projectRoot = path.resolve(__dirname, '../'), 9 | ProgressBarPlugin = require('progress-bar-webpack-plugin'), 10 | useCssSourceMap = 11 | (env.dev && config.dev.cssSourceMap) || 12 | (env.prod && config.build.productionSourceMap) 13 | 14 | function resolve (dir) { 15 | return path.join(__dirname, '..', dir) 16 | } 17 | 18 | module.exports = { 19 | entry: { 20 | app: './src/main.js' 21 | }, 22 | output: { 23 | path: path.resolve(__dirname, '../dist'), 24 | publicPath: config[env.prod ? 'build' : 'dev'].publicPath, 25 | filename: 'js/[name].js', 26 | chunkFilename: 'js/[id].[chunkhash].js' 27 | }, 28 | resolve: { 29 | extensions: ['.js', '.vue', '.json'], 30 | modules: [ 31 | resolve('src'), 32 | resolve('node_modules') 33 | ], 34 | alias: config.aliases 35 | }, 36 | module: { 37 | rules: [ 38 | { // eslint 39 | enforce: 'pre', 40 | test: /\.(vue|js)$/, 41 | loader: 'eslint-loader', 42 | include: projectRoot, 43 | exclude: /node_modules/, 44 | options: { 45 | formatter: require('eslint-friendly-formatter') 46 | } 47 | }, 48 | { 49 | test: /\.js$/, 50 | loader: 'babel-loader', 51 | include: projectRoot, 52 | exclude: /node_modules/ 53 | }, 54 | { 55 | test: /\.vue$/, 56 | loader: 'vue-loader', 57 | options: { 58 | postcss: cssUtils.postcss, 59 | loaders: merge({js: 'babel-loader'}, cssUtils.styleLoaders({ 60 | sourceMap: useCssSourceMap, 61 | extract: env.prod 62 | })), 63 | transformToRequire: { 64 | video: 'src', 65 | source: 'src', 66 | img: 'src', 67 | image: 'xlink:href' 68 | } 69 | } 70 | }, 71 | { 72 | test: /\.json$/, 73 | loader: 'json-loader' 74 | }, 75 | { 76 | test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, 77 | loader: 'url-loader', 78 | options: { 79 | limit: 10000, 80 | name: 'img/[name].[hash:7].[ext]' 81 | } 82 | }, 83 | { 84 | test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, 85 | loader: 'url-loader', 86 | options: { 87 | limit: 10000, 88 | name: 'fonts/[name].[hash:7].[ext]' 89 | } 90 | } 91 | ] 92 | }, 93 | plugins: [ 94 | new webpack.DefinePlugin({ 95 | 'process.env': config[env.prod ? 'build' : 'dev'].env, 96 | 'DEV': env.dev, 97 | 'PROD': env.prod, 98 | '__THEME': '"' + env.platform.theme + '"' 99 | }), 100 | new webpack.LoaderOptionsPlugin({ 101 | minimize: env.prod, 102 | options: { 103 | context: path.resolve(__dirname, '../src'), 104 | postcss: cssUtils.postcss 105 | } 106 | }), 107 | new ProgressBarPlugin({ 108 | format: config.progressFormat 109 | }) 110 | ], 111 | performance: { 112 | hints: false 113 | } 114 | } 115 | -------------------------------------------------------------------------------- /template/build/webpack.dev.conf.js: -------------------------------------------------------------------------------- 1 | var 2 | fs = require('fs'), 3 | path = require('path'), 4 | config = require('../config'), 5 | webpack = require('webpack'), 6 | merge = require('webpack-merge'), 7 | cssUtils = require('./css-utils'), 8 | baseWebpackConfig = require('./webpack.base.conf'), 9 | HtmlWebpackPlugin = require('html-webpack-plugin'), 10 | FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') 11 | 12 | // add hot-reload related code to entry chunks 13 | Object.keys(baseWebpackConfig.entry).forEach(function (name) { 14 | baseWebpackConfig.entry[name] = ['./build/hot-reload.js', baseWebpackConfig.entry[name]] 15 | }) 16 | 17 | module.exports = merge(baseWebpackConfig, { 18 | // eval-source-map is faster for development 19 | devtool: '#cheap-module-eval-source-map', 20 | devServer: { 21 | historyApiFallback: true, 22 | noInfo: true 23 | }, 24 | module: { 25 | rules: cssUtils.styleRules({ 26 | sourceMap: config.dev.cssSourceMap, 27 | postcss: true 28 | }) 29 | }, 30 | plugins: [ 31 | new webpack.HotModuleReplacementPlugin(), 32 | new webpack.NoEmitOnErrorsPlugin(), 33 | new HtmlWebpackPlugin({ 34 | filename: 'index.html', 35 | template: 'src/index.html', 36 | inject: true, 37 | serviceWorkerLoader: `` 39 | }), 40 | new FriendlyErrorsPlugin({ 41 | clearConsole: config.dev.clearConsoleOnRebuild 42 | }) 43 | ] 44 | }) 45 | -------------------------------------------------------------------------------- /template/build/webpack.prod.conf.js: -------------------------------------------------------------------------------- 1 | var 2 | path = require('path'), 3 | config = require('../config'), 4 | cssUtils = require('./css-utils'), 5 | webpack = require('webpack'), 6 | merge = require('webpack-merge'), 7 | baseWebpackConfig = require('./webpack.base.conf'), 8 | ExtractTextPlugin = require('extract-text-webpack-plugin'), 9 | HtmlWebpackPlugin = require('html-webpack-plugin'), 10 | OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin'), 11 | CopyWebpackPlugin = require('copy-webpack-plugin'), 12 | SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin'), 13 | fsUtils = require('./fs-utils') 14 | 15 | module.exports = merge(baseWebpackConfig, { 16 | module: { 17 | rules: cssUtils.styleRules({ 18 | sourceMap: config.build.productionSourceMap, 19 | extract: true, 20 | postcss: true 21 | }) 22 | }, 23 | devtool: config.build.productionSourceMap ? '#source-map' : false, 24 | plugins: [ 25 | new webpack.optimize.UglifyJsPlugin({ 26 | sourceMap: config.build.productionSourceMap, 27 | minimize: true, 28 | compress: { 29 | warnings: false 30 | } 31 | }), 32 | // Compress extracted CSS. We are using this plugin so that possible 33 | // duplicated CSS from different components can be deduped. 34 | new OptimizeCSSPlugin({ 35 | cssProcessorOptions: { 36 | safe: true 37 | } 38 | }), 39 | // extract css into its own file 40 | new ExtractTextPlugin({ 41 | filename: '[name].[contenthash].css' 42 | }), 43 | new HtmlWebpackPlugin({ 44 | filename: path.resolve(__dirname, '../dist/index.html'), 45 | template: 'src/index.html', 46 | inject: true, 47 | minify: { 48 | removeComments: true, 49 | collapseWhitespace: true, 50 | removeAttributeQuotes: true 51 | // more options: 52 | // https://github.com/kangax/html-minifier#options-quick-reference 53 | }, 54 | // necessary to consistently work with multiple chunks via CommonsChunkPlugin 55 | chunksSortMode: 'dependency', 56 | serviceWorkerLoader: `` 58 | }), 59 | // split vendor js into its own file 60 | new webpack.optimize.CommonsChunkPlugin({ 61 | name: 'vendor', 62 | minChunks: function (module, count) { 63 | // any required modules inside node_modules are extracted to vendor 64 | return ( 65 | module.resource && 66 | /\.js$/.test(module.resource) && 67 | ( 68 | module.resource.indexOf('quasar') > -1 || 69 | module.resource.indexOf( 70 | path.join(__dirname, '../node_modules') 71 | ) === 0 72 | ) 73 | ) 74 | } 75 | }), 76 | // extract webpack runtime and module manifest to its own file in order to 77 | // prevent vendor hash from being updated whenever app bundle is updated 78 | new webpack.optimize.CommonsChunkPlugin({ 79 | name: 'manifest', 80 | chunks: ['vendor'] 81 | }), 82 | // copy custom static assets 83 | new CopyWebpackPlugin([ 84 | { 85 | from: path.resolve(__dirname, '../src/statics'), 86 | to: 'statics', 87 | ignore: ['.*'] 88 | } 89 | ]), 90 | // service worker caching 91 | new SWPrecacheWebpackPlugin({ 92 | cacheId: 'my-quasar-app', 93 | filename: 'service-worker.js', 94 | staticFileGlobs: ['dist/**/*.{js,html,css,woff,ttf,eof,woff2,json,svg,gif,jpg,png,mp3}'], 95 | minify: true, 96 | stripPrefix: 'dist/' 97 | }) 98 | ] 99 | }) 100 | -------------------------------------------------------------------------------- /template/config/dev.env.js: -------------------------------------------------------------------------------- 1 | var merge = require('webpack-merge') 2 | var prodEnv = require('./prod.env') 3 | 4 | module.exports = merge(prodEnv, { 5 | NODE_ENV: '"development"' 6 | }) 7 | -------------------------------------------------------------------------------- /template/config/index.js: -------------------------------------------------------------------------------- 1 | var path = require('path') 2 | 3 | module.exports = { 4 | // Webpack aliases 5 | aliases: { 6 | quasar: path.resolve(__dirname, '../node_modules/quasar-framework/'), 7 | src: path.resolve(__dirname, '../src'), 8 | assets: path.resolve(__dirname, '../src/assets'), 9 | '@': path.resolve(__dirname, '../src/components'), 10 | variables: path.resolve(__dirname, '../src/themes/quasar.variables.styl') 11 | }, 12 | 13 | // Progress Bar Webpack plugin format 14 | // https://github.com/clessg/progress-bar-webpack-plugin#options 15 | progressFormat: ' [:bar] ' + ':percent'.bold + ' (:msg)', 16 | 17 | // Default theme to build with ('ios' or 'mat') 18 | defaultTheme: 'mat', 19 | 20 | build: { 21 | env: require('./prod.env'), 22 | publicPath: '', 23 | productionSourceMap: false, 24 | 25 | // Remove unused CSS 26 | // Disable it if it has side-effects for your specific app 27 | purifyCSS: true 28 | }, 29 | dev: { 30 | env: require('./dev.env'), 31 | cssSourceMap: true, 32 | // auto open browser or not 33 | openBrowser: true, 34 | publicPath: '/', 35 | port: 8081, 36 | 37 | // If for example you are using Quasar Play 38 | // to generate a QR code then on each dev (re)compilation 39 | // you need to avoid clearing out the console, so set this 40 | // to "false", otherwise you can set it to "true" to always 41 | // have only the messages regarding your last (re)compilation. 42 | clearConsoleOnRebuild: false, 43 | 44 | // Proxy your API if using any. 45 | // Also see /build/script.dev.js and search for "proxy api requests" 46 | // https://github.com/chimurai/http-proxy-middleware 47 | proxyTable: {} 48 | } 49 | } 50 | 51 | /* 52 | * proxyTable example: 53 | * 54 | proxyTable: { 55 | // proxy all requests starting with /api 56 | '/api': { 57 | target: 'https://some.address.com/api', 58 | changeOrigin: true, 59 | pathRewrite: { 60 | '^/api': '' 61 | } 62 | } 63 | } 64 | */ 65 | -------------------------------------------------------------------------------- /template/config/prod.env.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | NODE_ENV: '"production"' 3 | } 4 | -------------------------------------------------------------------------------- /template/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "quasar-app", 3 | "version": "0.0.1", 4 | "description": "A Quasar App", 5 | "author": "Your Name", 6 | "scripts": { 7 | "clean": "node build/script.clean.js", 8 | "dev": "node build/script.dev.js", 9 | "build": "node build/script.build.js", 10 | "lint": "eslint --ext .js,.vue src" 11 | }, 12 | "dependencies": { 13 | "babel-runtime": "^6.25.0", 14 | "quasar-extras": "0.x", 15 | "quasar-framework": "^0.14.6", 16 | "vue": "^2.5.2", 17 | "vue-router": "^2.7.0" 18 | }, 19 | "devDependencies": { 20 | "autoprefixer": "^6.4.0", 21 | "babel-core": "^6.0.0", 22 | "babel-eslint": "^7.0.0", 23 | "babel-loader": "^7.1.2", 24 | "babel-plugin-transform-runtime": "^6.0.0", 25 | "babel-preset-es2015": "^6.0.0", 26 | "babel-preset-stage-2": "^6.0.0", 27 | "colors": "^1.1.2", 28 | "connect-history-api-fallback": "^1.1.0", 29 | "copy-webpack-plugin": "^4.1.0", 30 | "css-loader": "^0.28.7", 31 | "es6-promise": "^4.1.1", 32 | "eslint": "^4.8.0", 33 | "eslint-config-standard": "^10.2.1", 34 | "eslint-friendly-formatter": "^3.0.0", 35 | "eslint-loader": "^1.9.0", 36 | "eslint-plugin-html": "^3.2.2", 37 | "eslint-plugin-import": "^2.7.0", 38 | "eslint-plugin-node": "^5.2.0", 39 | "eslint-plugin-promise": "^3.5.0", 40 | "eslint-plugin-standard": "^3.0.1", 41 | "eventsource-polyfill": "^0.9.6", 42 | "express": "^4.16.1", 43 | "extract-text-webpack-plugin": "^3.0.0", 44 | "file-loader": "^0.11.1", 45 | "friendly-errors-webpack-plugin": "^1.1.3", 46 | "glob": "^7.1.2", 47 | "html-webpack-plugin": "^2.30.1", 48 | "http-proxy-middleware": "^0.17.0", 49 | "json-loader": "^0.5.7", 50 | "opn": "^5.0.0", 51 | "optimize-css-assets-webpack-plugin": "^3.2.0", 52 | "postcss-loader": "^1.0.0", 53 | "progress-bar-webpack-plugin": "^1.10.0", 54 | "purify-css": "^1.2.6", 55 | "shelljs": "^0.7.0", 56 | "stylus": "^0.54.5", 57 | "stylus-loader": "^3.0.1", 58 | "sw-precache-webpack-plugin": "^0.11.4", 59 | "uglify-es": "^3.1.3", 60 | "url-loader": "^0.5.7", 61 | "vue-loader": "^13.0.5", 62 | "vue-style-loader": "^3.0.3", 63 | "vue-template-compiler": "^2.5.2", 64 | "webpack": "^3.6.0", 65 | "webpack-dev-middleware": "^1.12.0", 66 | "webpack-hot-middleware": "^2.19.1", 67 | "webpack-merge": "^4.1.0" 68 | } 69 | } 70 | -------------------------------------------------------------------------------- /template/src/App.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 18 | 19 | 31 | -------------------------------------------------------------------------------- /template/src/assets/quasar-logo-full.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 19 | 21 | 43 | 45 | 46 | 48 | image/svg+xml 49 | 51 | 52 | 53 | 54 | 55 | 60 | 63 | 66 | 69 | 75 | 79 | 83 | 87 | 91 | 95 | 99 | 103 | 104 | 105 | 106 | 107 | 113 | 118 | 126 | 133 | 142 | 151 | 160 | 169 | 178 | 187 | 188 | 189 | 190 | 191 | 192 | -------------------------------------------------------------------------------- /template/src/components/Hello.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 18 | 19 | 20 | 36 | -------------------------------------------------------------------------------- /template/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | Quasar PWA App 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | <% for (var chunk of webpack.chunks) { 27 | for (var file of chunk.files) { 28 | if (file.match(/\.(js|css)$/)) { %> 29 | <% }}} %> 30 | 31 | 32 | 35 |
36 | 37 | <%= htmlWebpackPlugin.options.serviceWorkerLoader %> 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /template/src/main.js: -------------------------------------------------------------------------------- 1 | // === DEFAULT / CUSTOM STYLE === 2 | // WARNING! always comment out ONE of the two require() calls below. 3 | // 1. use next line to activate CUSTOM STYLE (./src/themes) 4 | // require(`./themes/app.${__THEME}.styl`) 5 | // 2. or, use next line to activate DEFAULT QUASAR STYLE 6 | require(`quasar/dist/quasar.${__THEME}.css`) 7 | // ============================== 8 | 9 | // Uncomment the following lines if you need IE11/Edge support 10 | // require(`quasar/dist/quasar.ie`) 11 | // require(`quasar/dist/quasar.ie.${__THEME}.css`) 12 | 13 | import Vue from 'vue' 14 | import Quasar from 'quasar' 15 | import router from './router' 16 | 17 | Vue.config.productionTip = false 18 | Vue.use(Quasar) // Install Quasar Framework 19 | 20 | if (__THEME === 'mat') { 21 | // require('quasar-extras/roboto-font') 22 | } 23 | // import 'quasar-extras/material-icons' 24 | // import 'quasar-extras/ionicons' 25 | // import 'quasar-extras/fontawesome' 26 | // import 'quasar-extras/animate' 27 | 28 | /* eslint-disable no-new */ 29 | new Vue({ 30 | el: '#q-app', 31 | router, 32 | render: h => h(require('./App').default) 33 | }) 34 | -------------------------------------------------------------------------------- /template/src/router.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import VueRouter from 'vue-router' 3 | 4 | import Hello from '@/Hello.vue' 5 | 6 | Vue.use(VueRouter) 7 | 8 | /* 9 | * Uncomment this section and use "load()" if you want 10 | * to lazy load routes. 11 | function load (component) { 12 | // '@' is aliased to src/components 13 | return () => import(`@/${component}.vue`) 14 | } 15 | */ 16 | 17 | export default new VueRouter({ 18 | /* 19 | * NOTE! VueRouter "history" mode DOESN'T works for Cordova builds, 20 | * it is only to be used only for websites. 21 | * 22 | * If you decide to go with "history" mode, please also open /config/index.js 23 | * and set "build.publicPath" to something other than an empty string. 24 | * Example: '/' instead of current '' 25 | * 26 | * If switching back to default "hash" mode, don't forget to set the 27 | * build publicPath back to '' so Cordova builds work again. 28 | */ 29 | 30 | routes: [ 31 | { path: '/', component: Hello } 32 | ] 33 | }) 34 | -------------------------------------------------------------------------------- /template/src/statics/icons/apple-icon-152x152.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quasarframework/quasar-template-pwa/528957a69aed609275d8f6c81aeafb67fc60bcdf/template/src/statics/icons/apple-icon-152x152.png -------------------------------------------------------------------------------- /template/src/statics/icons/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quasarframework/quasar-template-pwa/528957a69aed609275d8f6c81aeafb67fc60bcdf/template/src/statics/icons/favicon-16x16.png -------------------------------------------------------------------------------- /template/src/statics/icons/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quasarframework/quasar-template-pwa/528957a69aed609275d8f6c81aeafb67fc60bcdf/template/src/statics/icons/favicon-32x32.png -------------------------------------------------------------------------------- /template/src/statics/icons/icon-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quasarframework/quasar-template-pwa/528957a69aed609275d8f6c81aeafb67fc60bcdf/template/src/statics/icons/icon-192x192.png -------------------------------------------------------------------------------- /template/src/statics/icons/icon-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quasarframework/quasar-template-pwa/528957a69aed609275d8f6c81aeafb67fc60bcdf/template/src/statics/icons/icon-512x512.png -------------------------------------------------------------------------------- /template/src/statics/icons/ms-icon-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quasarframework/quasar-template-pwa/528957a69aed609275d8f6c81aeafb67fc60bcdf/template/src/statics/icons/ms-icon-144x144.png -------------------------------------------------------------------------------- /template/src/statics/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Quasar App", 3 | "short_name": "Quasar-PWA", 4 | "icons": [ 5 | { 6 | "src": "/statics/icons/icon-192x192.png", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | }, 10 | { 11 | "src": "/statics/icons/icon-512x512.png", 12 | "sizes": "512x512", 13 | "type": "image/png" 14 | } 15 | ], 16 | "start_url": "/index.html", 17 | "display": "standalone", 18 | "background_color": "#ffffff", 19 | "theme_color": "#027be3" 20 | } 21 | -------------------------------------------------------------------------------- /template/src/statics/quasar-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quasarframework/quasar-template-pwa/528957a69aed609275d8f6c81aeafb67fc60bcdf/template/src/statics/quasar-logo.png -------------------------------------------------------------------------------- /template/src/themes/app.ios.styl: -------------------------------------------------------------------------------- 1 | // This file is included in the build if src/main.js imports it. 2 | // Otherwise the default iOS CSS file is bundled. 3 | // Check "DEFAULT / CUSTOM STYLE" in src/main.js 4 | 5 | // App Shared Variables 6 | // -------------------------------------------------- 7 | // Shared Stylus variables go in the app.variables.styl file 8 | @import 'app.variables' 9 | 10 | // Quasar iOS Design Stylus 11 | // -------------------------------------------------- 12 | // Custom App variables must be declared before importing Quasar. 13 | // Quasar will use its default values when a custom variable isn't provided. 14 | @import '~quasar-framework/dist/quasar.ios.styl' 15 | -------------------------------------------------------------------------------- /template/src/themes/app.mat.styl: -------------------------------------------------------------------------------- 1 | // This file is included in the build if src/main.js imports it. 2 | // Otherwise the default Material CSS file is bundled. 3 | // Check "DEFAULT / CUSTOM STYLE" in src/main.js 4 | 5 | // App Shared Variables 6 | // -------------------------------------------------- 7 | // Shared Stylus variables go in the app.variables.styl file 8 | @import 'app.variables' 9 | 10 | // Quasar Material Design Stylus 11 | // -------------------------------------------------- 12 | // Custom App variables must be declared before importing Quasar. 13 | // Quasar will use its default values when a custom variable isn't provided. 14 | @import '~quasar-framework/dist/quasar.mat.styl' 15 | -------------------------------------------------------------------------------- /template/src/themes/app.variables.styl: -------------------------------------------------------------------------------- 1 | // This file is included in the build if src/main.js imports 2 | // either app.mat.styl or app.ios.styl. 3 | // Check "DEFAULT / CUSTOM STYLE" in src/main.js 4 | 5 | // App Shared Variables 6 | // -------------------------------------------------- 7 | // To customize the look and feel of this app, you can override 8 | // the Stylus variables found in Quasar's source Stylus files. Setting 9 | // variables before Quasar's Stylus will use these variables rather than 10 | // Quasar's default Stylus variable values. Stylus variables specific 11 | // to the themes belong in either the app.ios.styl or app.mat.styl files. 12 | 13 | 14 | // App Shared Color Variables 15 | // -------------------------------------------------- 16 | // It's highly recommended to change the default colors 17 | // to match your app's branding. 18 | 19 | $primary = #027be3 20 | $secondary = #26A69A 21 | $tertiary = #555 22 | 23 | $neutral = #E0E1E2 24 | $positive = #21BA45 25 | $negative = #DB2828 26 | $info = #31CCEC 27 | $warning = #F2C037 28 | -------------------------------------------------------------------------------- /template/src/themes/quasar.variables.styl: -------------------------------------------------------------------------------- 1 | // 2 | // Webpack alias "variables" points to this file. 3 | // So you can import it in your app's *.vue files 4 | // inside the 12 | 13 | 14 | // First we load app's Stylus variables 15 | @import 'app.variables' 16 | 17 | // Then we load Quasar Stylus variables. 18 | // Any variables defined in "app.variables.styl" 19 | // will override Quasar's ones. 20 | // 21 | // NOTICE that we only import Core Quasar Variables 22 | // like colors, media breakpoints, and so. 23 | // No component variable will be included. 24 | @import '~quasar/dist/core.variables' 25 | -------------------------------------------------------------------------------- /template/templates/component.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 12 | 13 | 15 | -------------------------------------------------------------------------------- /template/templates/layout.vue: -------------------------------------------------------------------------------- 1 | 63 | 64 | 71 | 72 | 74 | -------------------------------------------------------------------------------- /template/templates/page.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 15 | 16 | 18 | --------------------------------------------------------------------------------