Socket
Socket
Sign inDemoInstall

inversify-hooks

Package Overview
Dependencies
12
Maintainers
1
Versions
37
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

inversify-hooks

Wrapper of inversify-props to inject your dependencies in the components, made with TypeScript using hooks.


Version published
Maintainers
1
Weekly downloads
817
increased by8.07%
Bundle size
11.3 kB
Minified + gzipped

Weekly downloads

Readme

Source

Inversify Hooks

This package is a wrapper of inversify-props to simplify how inject your dependencies in components with hooks.

GitHub last commit GitHub license GitHub forks GitHub contributors GitHub issues

logo

Installation

$ npm install inversify-hooks reflect-metadata --save

The inversify-hooks type definitions are included in the inversify-hooks npm package.

How to use

import 'reflect-metadata'; // Import only once
import { container, useInject } from 'inversify-hooks';

container.addSingleton<IService1>(Service1);

function ExampleComponent() {
  const [service1] = useInject<IService1>(cid.IService1);

  useEffect(() => {
    if (!service1) {
      return;
    }

    service1.asyncMethod();
  }, [])
}

You can also use any ID that you prefer

container.addSingleton<IService1>(Service1, 'MyService1');

function ExampleComponent() {
  const service1 = useInject<IService1>('MyService1');
}

:warning: Important! inversify-hooks requires TypeScript >= 2.0 and the experimentalDecorators, emitDecoratorMetadata, types and lib compilation options in your tsconfig.json file.

{
    "compilerOptions": {
        "target": "es5",
        "lib": ["es6"],
        "types": ["reflect-metadata"],
        "module": "commonjs",
        "moduleResolution": "node",
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true
    }
}

How to test

There are more examples of how to test in inversify-props

More examples

There are more examples of how to use the container in services or other components in inversify-props

Why we made this package

You can learn more about why we made this packages in the original repo.

How register a dependency

If you're not familizared of how to register dependencies, check the docs.

How to configure Uglify or Terser

f you're using Uglify or Terser you need to configure well the plugin, check the docs.

Keywords

FAQs

Last updated on 07 Jul 2020

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc