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


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


To go through this guide, you will need:


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

vue create vuejs-platformsh
cd vuejs-platformsh

Set the platform Git remote:

platform project:set-remote <project id>

Add the Vue plugin:

vue add platformsh

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

2. Deploy your application to

Commit and push your code to deploy your application:

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

3. Test your application on

platform url

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

4. Fetch environment variables

The plugin will automatically extract the environment variables.

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

import platformshVar from 'platformsh_variables'


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


What about proper redirecting when Vue Router is in ‘history’ mode? I know that Platform has their own way of doing redirects, wondering whether I need to touch the routes.yaml file.

@modermo I think what you want is to add passthru option to the web location YAML object.

That option will for all the routes to be passed to the index.html, and you can handle that route in your app.

For example:

name: app
type: nodejs:12
# The configuration of app when it is exposed to the web.
      root: "dist"
        - "index.html"
      passthru: /index.html


1 Like

@ yann-deshayes That works. Thanks for that.

I would consider including this in the above documentation, as getting History mode for a Vue SPA working on different server environments is a common but somewhat tricky endeavour.