Deploy VueJS App in a subdirectory Deploy VueJS App in a subdirectory vue.js vue.js

Deploy VueJS App in a subdirectory


For Vue CLI 3 it is pretty simple.

Edit your vue.config.js (if there is none, create it in project root directory) and add following lines:

module.exports = {  baseUrl: "./"};

Or whatever sub-directory you want.

You may also decide according to NODE_ENV. See the docs.

module.exports = {  baseUrl: process.env.NODE_ENV === 'production'    ? '/production-sub-path/'    : '/'}

UPDATE

As mentioned in comments below, for Vue CLI 3.3+ use publicPath property instead of baseUrl.


Assuming you are using the webpack template from vue-cli, you need to edit the assetsPublicPath property in config/index.js - notice there is one for build and for dev

Check out Handling Static Assets section in the docs for more info.

Update:

Newer link for CLI v3+ users: https://cli.vuejs.org/guide/html-and-static-assets.html

Notice the property is just called publicPath


If you installed your app with

npm install -g @vue/clivue uithen you should create file vue.config.js in the top project folder (where package.json is)and paste like above.