Preparation

The demo will show the creation of a simple repository based on NuxtJS, which will be transformed into a Micro Service architecture using VueMS.

A full installation of the respirator you can see in this place.

Create clean NuxtJS project

To build a demo we use the ready CLI NuxtJS library to build applications.

Using create-nuxt-app

  npx create-nuxt-app vuems-demo

Launch project

Preview Start demo

Project start up structure

Init directory structure

Install required libraries

If we already have a working application, we can start installing VueMS.

VueMS

  npm install @ergonode/vuems

Load module and set first configuration.

nuxt.config.js
  export default {
    buildModules: [
      ...
      '@ergonode/vuems'
    ],
    vuems: {
      logLoadedModules: true,
    },
  }
For the time being, we don't need any other VueMS settings, we will set them in the next steps.

Router

We need to install @nuxtjs/router to make VueMS work properly.

  npm install --save-dev @nuxtjs/router

Load module.

nuxt.config.js
  export default {
    buildModules: [
      ...
      '@nuxtjs/router',
    ],
  }

Create router.js file.

router.js
import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export function createRouter() {
  return new Router({
    mode: 'history',
    base: '/',
    routes: [],
    fallback: false,
  })
}
At this point our application does not have routing.

Loading the ~/.nuxt/routerHelper.modules file is not possible now because we do not have any module added so the file does not exist yet.