@sport-activities/nuxt-di

Dependecy Injector

Basic DI that give you access to your services as singletons through this.$services

Installation

npm i -S @nuxt-modules/di  --registry http://nexus3.osiris.withoxylane.com/repository/JSCorp/

Usage

In nuxt.config.js

modules: [
  ...,
  ['@nuxt-modules/di', {
    baseUrl: process.env.BASE_URL
  }],
  ...
]

Nuxt context is automatically injected as first argument of service constructor and you can pass custom data through module options (see example below)

Service classes as to be in a services folder in the project root.

With es6 decorators (experimental)

Adds babel es6 decorator support

npm i -S babel-plugin-transform-decorators-legacy

In nuxt.config.js

build: {
  babel: {
    'plugins': ['transform-decorators-legacy']
  },
  ...
}

Then you have tag your services with the @injectable() decorator.

import injectable from '@nuxt-modules/di/decorators'

@injectable('myUserService')
export default class User {
  constructor ({ app }, { baseUrl }) {
    this.app = app
    this.BASE_URL = baseUrl
  }

  ...
}

For example, this service will be then accessible through this.$services.myUserService

Without es6 decorators

Decorator basically just adds a getInjectableName(void): string method to injected service. So you can avoid decorators usage if you implements the method on your own.

export default class User {
  constructor ({ app }, { baseUrl }) {
    this.app = app
    this.BASE_URL = baseUrl
  }

  getInjectableName() {
    return 'myUserService'
  }
}