use-dependency-alert
TypeScript icon, indicating that this package has built-in type declarations

0.1.4 • Public • Published

🚨 use-dependency-alert

npm NPM npm Coveralls github codecov CircleCI Snyk Vulnerabilities for GitHub Repo

React hook for debugging hook dependency arrays to validate what is changing, and how often. Not intended to be included in the final production build, but handy to use while debugging and confirming hooks are being triggered/rerendered when expected.

Install

Via npm

npm install use-dependency-alert

Via Yarn

yarn add use-dependency-alert

How to use

import { useEffect } from 'react'
import useDepedencyAlert from 'use-dependency-alert'

const TestComponent = ({ changingProp }) => {
  useEffect(() => {
    // This should not be changing often, but useDependencyAlert will let us know if that’s the case
  }, useDependencyAlert([changingProp]))

  return <div>{changingProp}</div>
}

With Options

import { useEffect } from 'react'
import useDepedencyAlert from 'use-dependency-alert'

const TestComponent = ({ changingProp }) => {
  useEffect(() => {
    // This should not be changing often, but useDependencyAlert will let us know if that’s the case
  }, useDependencyAlert(
    [changingProp],
    {
      context: 'TestComponent',
      dependencyKeys: ['changingProps'],
      logDelay: 5000,
    },
  ))

  return <div>{changingProp}</div>
}

Options

  • context: string - Basic string for making alerts unique to help differentiate from others.
  • dependencyKeys: string[] - Array of names to apply to depedency indexes in the array. Intended to streamline debugging.
  • logDelay: number - Milliseconds used to delay the logging of depedency updates to help keep the noise down in the console.

License

MIT © Ryan Hefner

Readme

Keywords

none

Package Sidebar

Install

npm i use-dependency-alert

Weekly Downloads

56

Version

0.1.4

License

MIT

Unpacked Size

174 kB

Total Files

11

Last publish

Collaborators

  • ryanhefner