Developing Electron Apps

Misc

Deployment of SPA

There exist many services that allow deploying applications with ease.To list all of them would not be possible so we will focus on the general deployment process and some specifics for common services.

If your favorite deployment tool is missing feel free to create a pull request on GitHub to add it to the list.

General deployment

The first step in deploying you Quasar SPA is always to build a production-ready bundle of your files, which gets rid of development statements and minifies your source.

This command will build your project in SPA mode and output your production ready bundle to a newly created folder /dist/spa-<theme> were <theme> is replaced by the theme you chose to build with.

To serve your production files it is required to use a web server, so to serve over http:// protocol. Simply opening the index.html file from within your browser will not work, since this uses the file:// protocol instead.

Common choices for web servers are nginx, Caddy, Apache, Express; but you should be able to use whatever web server you want.

The web server requires no special setup (unless you built with Vue Router in “history” mode). The main requirement is to be able to serve static files from a directory, so consult the documentation of your web server on how to set up static file serving.

Now your application should be successfully deployed using Surge. You should be able to adapt this guide to any other static site deployment tool.

Deploying on GitHub Pages

To deploy your Quasar application to GitHub pages the first step is to create a special repository on GitHub which is named <username>.github.io. Clone this repository to your local machine.

Next, you need to build your Quasar application like it is described in the general deployment section. This will result in a spa-<theme> directory inside the dist directory. Copy the content of this folder to your cloned repository.

The last step is to add a commit in your repository an push to GitHub. After a short time, you should be able to visit your Quasar application at https://.github.io/.

Adding a custom domain to GitHub pages

Please see the GitHub pages guides for an in-depth explanation on how to set up a custom domain.

Automated deployment to GitHub pages with push-dir

Manual copying all your files to your GitHub Pages repository can be a cumbersome task to do. This step can be automated by using the push-dir package.