nuxt-ioc

nuxt-ioc - IOC containers for Vue/Nuxt frameworks

IoC/DI for Nuxt.js framework powered by Inversify.js and inspired by great Java Spring and Nest.js frameworks.

Requirements

• Nuxt.js
• Vue 2.x
• @nuxt/typescript-build module installed

Quick start

Please refer to our documentation for complete guide.

Example code

<template>
  <div>My component content</div>
</template>

<script lang="ts">
  import { Injectable, BaseComponent, Inject, factory } from 'nuxt';
  import MyService from '~/Application/MyService';

  @Injectable()
  export class MyComponent extends BaseComponent {
    @Inject(MyService)
    private gMyService: MyService;

    public async $fetch(): Promise<void> {
      await this.gMyService.getMyData();
    }

    public $mounted(): void {
      console.log('this is Vue mounted life hook');
    }
  }

  export default factory(MyComponent);
</script>

Local Test

If you want test our example locally, you need change coreModule ind the index.ts

const options = {
  // @ts-ignore
  containerPath: '~/Application/container',
  coreModule: '../../',
  // coreModule: 'nuxt-ioc',
  ...moduleOptions,
};