npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

ioc-service-container

v2.0.0

Published

Lightweight ioc service container

Downloads

985

Readme

IoC Service Container

This is a lightweight zero-dependency library for a service container written in TypeScript.

Quality Gate Status Bugs Code Smells Coverage Security Rating

min-size min-size-g-zip dependency-count npm-version ts-types

Features

Demo

In this StackBlitz-Demo you can see a demonstration of the ioc-service-container. In the App.tsx you can verify that the UserService is fully typed without importing the class.

TypeScriptSupport

Get started

Install the dependency with npm install ioc-service-container

Usage

1. Define the Types

If you use the ioc-service-container in a TypeScript project, define the types of your services in a ioc.d.ts file otherwise you can skip this step.

// Import your services
import { TestApi } from '../your-path/to/TestApi';
import { FooApi } from '../your-path/to/FooApi';
import { TestService } from '../your-path/to/TestService';

// Create the mapping between ServiceId and Service
type IoCTypes = {
  TestApi: TestApi;
  FooApi: FooApi;
  TestService: TestService;
  myString: string;
  // ...
};

// Redeclare the scg function to get full Typscript support
declare module 'ioc-service-container' {
  export function scg<T extends keyof IoCTypes, U extends IoCTypes[T]>(id: T): U;
}

2. Setup your services

According to this you have to pass a factory, a constructable or an entity to the ioc container. So at the initial script of your application you call a function named e.g. setupService:

import { ServiceContainer } from 'ioc-service-container';

function setupService() {
  ServiceContainer.set('TestApi', CustomTestApi); // setup by class reference
  ServiceContainer.set('FooApi', () => new CustomFooApi()); // setup by custom factory

  const testService = new TestService();
  ServiceContainer.set('TestService', testService); // pass the instance directly
  ServiceContainer.set('myString', 'hello world'); // pass primitive values
}

The factory is only instantiated at need.

3. Inject services

Now you have 2 options to inject the requested service.

3.1 scg() Function

The first is the most common one: const testApi = scg('TestApi);. (Shortcut for ServiceContainer.get(). Because of the type declaration you have full TypeScript support at this point and no dependency on the file/class TestApi. (See the Demo)

3.2 @inject Decorator

This requires "experimentalDecorators": true to be enabled in your tsconfig.json (See Typescript Docs)

export class CustomTestService implements TestService {
  @inject
  private readonly customApi!: Api; // Important is the name of the property, it's mapped to the service id

  @inject('FooApi') // If you don't want to name your property like the service id, pass the id as parameter
  private readonly nameThisHowYouWant!: Api;

  private readonly fooApi = ServiceContainer.get<Api>('FooApi'); // Use this syntax if you don't want to use decorators

  private readonly barApi = scg('BarApi'); // Shortcut for ServiceContainer.get()
}

4. Other Use-Cases

For Testing or similar use cases you have the option to use ServiceContainer.isSet('anId'), ServiceContainer.override('anId', 123) or ServiceContainer.reset().

Background

Structuring your code and avoiding implizit dependencies is two of the most effective ways to avoiding bugs, especially when code gets extended. To goal of Dependency Injection (DI) is to prevent structures like this:

class CustomService {
  constructor() {
    this.api = new CustomApi();
  }
}

The CustomService has an implizit dependency to the CustomApi.

The goal of DI is to encapsulate the dependencies of a class. The CustomService should work without knowing which api it is using.