How to make a Vue.js single page application (SPA) on Platform.sh

Goal

This guide shows how to deploy a Vue.js application on Platform.sh, using Vue CLI 3.

Assumptions

To go through this guide, you will need:

Steps

1. Create a Vue.js application

Create a new Vue.js project with Vue CLI (ignore this step if you want to deploy an existing Vue.js application on Platform.sh):

vue create vuejs-platformsh
cd vuejs-platformsh

Set the platform Git remote:

platform project:set-remote <project id>

Add the Platform.sh Vue plugin:

vue add platformsh

This will plugin will add the Platform.sh configuration files to your project and extract the Platform.sh environment variables.

2. Deploy your application to Platform.sh

Commit and push your code to deploy your application:

git add --all
git commit -m "Vue.js on Platform.sh."
git push platform master

3. Test your application on Platform.sh

platform url

This opens a browser tab with your Vue.js application running.

4. Fetch Platform.sh environment variables

The plugin will automatically extract the Platform.sh environment variables.

To fetch those, you simply need to import the following package:

import platformshVar from 'platformsh_variables'

Conclusion

Using the Vue CLI, it’s very easy to setup and deploy a new or an existing Vue.js application on Platform.sh.