Quasar Framework-Vue.js

We know that Vue.js is a JavaScript framework for building User Interfaces. The limitation of Vue.js is it doesn’t provide actual UI elements or components that we can use.To solve this there are many UI frameworks that provide users with reusable, styled components. Quasar is one such framework. It offers high performance along with a full front-end stack for Vue.js. It provides Vue.js a full featured toolset for developing responsive front end apps. Three ways to Bootstrap our app using Quasar is UMD/Standalone, Quasar CLI, Vue CLI 3 plugin.

The recommended way among these three is using Quasar CLI. This can be used to build SPSs, SSRs, PWAs, Mobile apps, Electron apps. 

Let’s see how to  install Quasar CLI. Make sure you have Node>=10 and NPM>=5 installed on your system.

$ yarn global add @quasar/cli
# or
$ npm install -g @quasar/cli
Create a project folder in Quasar CLI.
$ quasar create <folder_name>

Quasar CLI has two main packages: @quasar/cli, @quasar/app. First package will allow you to create a project folder and globally run commands. The second package gets installed into every Quasar folder. You can write npm scripts in package.json to run Quasar commands. 

// package.json
"scripts": {
  "dev": "quasar dev",
  "build": "quasar build",
  "build:pwa": "quasar build -m pwa"
}
This script will allow you to run $yarn dev or $yarn build without the need of @quasar/cli. Another way is to run npx to run commands. 
$ npx quasar dev