Dockerised Quasar development

Create your mobile, web and/or desktop app from a single HTML, CSS, and JavaScript (VueJS/Quasar) source

This repository provides a Quasar development environment using docker to get you up and running fast. The docker image has Quasar cli, Cordova, Android SDK and their dependencies pre-installed and configured so you can jump straight to the happy coding part.

What is Quasar?

Quasar is a framework for building hybrid mobile apps using Cordova, desktop apps using Electron, Single Page Apps, Server-side Render apps and Progressive Web apps all from a single VueJS ( 💓 ) codebase.

What is Cordova?

Cordova is a library for building cross-platform mobile applications with HTML, CSS, and JavaScript.

What is Electron?

Electron is a library for building cross-platform desktop applications with HTML, CSS, and JavaScript.

What is VueJS ( 💓 ) ?

VueJS is a lovable, scalable modern javascript framework.

Package contents

This repository consists of

• a docker-compose file which uses an 'android-cordova-quasar' docker image
• an empty quasar-cli project (the starter codebase generated by 'quasar init')
• some package.json "scripts" to get started

Please note that building your project for Mac and Windows mobile - as well as desktop - platforms will require some extra steps relevant to each platform.

For Android, you are ready to go.

Prerequisites

On your local machine you will first need to have installed:

• Docker
• Docker Compose
• node
• yarn ( npm install -g yarn , or platform specific way )

Installation

git clone https://github.com/djleven/quasar-dockerised-starter.git
cd quasar-dockerised-starter
yarn

Kickstart

1-) Start the container and launch hot reload dev environment (@ localhost:8080)

docker-compose up -d

2-) Add platform(s) you will be developing for:

Edit the packages.json with your app info (title, desc, author, etc)

Then run what you need

npm run add-android
npm run add-ios
npm run add-electron
npm run add-pwa

The above commands run quasar, cordova, etc commands inside the container.

Note: After adding electron you will probably have to restart your container.

Build / preview for Android

npm run add-android

If you wish to preview / install the build on your android device, connect it to your computer with a usb before running this (assuming Android developer settings are correct)

Note: The first time you run this command the build android process will take longer than the subsequent builds.

Run other commands in container

To launch a command prompt inside the container

npm run dc-bash

which is short for:

docker-compose exec quasar /bin/bash

To run one or more commands inside the container directly

npm run dc-exec 'runSomeCommand && maybeAnotherCommand'

which is short for

docker-compose exec quasar bash -c 'runSomeCommand && maybeAnotherCommand'

To run either one of the above but with your local system user id, just add a 'u' at the end

npm run dc-bashu
npm run dc-execu

Useful links

Vue Docs

Quasar Docs

Cordova Docs

Electron Docs

Contributing

Contributions, questions and comments are welcome.