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

@therealklanni/eslint-config

v1.0.0-beta.17

Published

Shareable ESLint config

Downloads

23

Readme

@therealklanni/eslint-config npm downloads

❗️ It's not recommended to use these configs directly. Instead, install and configure them via @therealklanni/eslint-plugin, for ease-of-use.

This package provides multiple eslint-configurations that configure popular ESLint plugins. You should extend the appropriate config depending on your use-case.


These configs provide an opinionated set of rules that:

  1. Help you adhere to best practices.
  2. Help catch probable issue vectors in your code (common pitfalls and code-smells).
  3. Maximize readability/understanding of your code.
  4. Maximize (ease of) maintaining/refactoring your code.

Any rules that might cause excessive errors and are not auto-fixable are set to "warn".

For these reasons, many of the rules are enabled and, of those, most are using the recommended configuration except where it makes sense for achieving said goals. When used with Prettier, conflicting rules are disabled.

💁‍♂️ You might also consider using @therealklanni/prettier-config

Available configurations (and what they configure)

Usage

  1. Install required dependencies
    npm install -D @therealklanni/eslint-config eslint{,-plugin-import}
  2. Optionally, view and install any additional dependencies, as needed
    # list dependencies
    yarn view @therealklanni/eslint-config peerDependencies
    
    # install what you need
    yarn add -D eslint-plugin-{jest,node,react} @therealklanni/prettier-config ...
  3. Configure as shown here
    {
      // you only need to specify plugins not provided by these configs
      "plugins": ["some-unrelated-plugin"],
      "extends": [
        // add one or more configs, AFTER any unrelated configs
        "@therealklanni",
        "@therealklanni/eslint-config/typescript",
        "@therealklanni/eslint-config/jest"
      ],
      // override any rules, if needed
      "rules": {
        "@typescript-eslint/semi": ["error", "always"]
      }
    }
  4. ???
  5. Profit

"Hard mode" example

DIY file globs. Allows for more control over how configs are applied.

{
  "extends": [
    // apply last
    "@therealklanni"
  ],
  "overrides": [
    // if you need other unrelated overrides, add them first
    {
      "files": ["*.js"],
      "extends": ["@therealklanni"],
      "rules": {
        "semi": ["error", "always"]
      }
    },
    {
      "files": ["*.ts"],
      "extends": [
        "some-unrelated-config",
        "@therealklanni",
        "@therealklanni/eslint-config/typescript"
      ],
      "rules": {
        "@typescript-eslint/semi": ["error", "always"],
        "@typescript-eslint/init-declarations": "off"
      }
    },
    {
      "files": ["**/__tests__/**"],
      "extends": ["@therealklanni/eslint-config/jest"],
      "rules": {
        "jest/no-if": "warn"
      }
    },
    // apply last when using Prettier config
    {
      "files": ["*.?(ts,js)"],
      "extends": ["@therealklanni/eslint-config/prettier"]
    }
  ]
}

"Easy mode" example

Applies configs automatically wrapped in an override with a default files glob.

{
  "extends": [
    "some-unrelated-config",
    // apply @therealklanni configs after unrelated configs
    "@therealklanni",
    "@therealklanni/eslint-config/jest/auto",
    "@therealklanni/eslint-config/typescript/auto",
    // applied globally
    "@therealklanni/eslint-config/prettier"
  ],
  "rules": {
    "semi": ["error", "always"],
    "@typescript-eslint/semi": ["error", "always"],
    "@typescript-eslint/init-declarations": "off",
    "jest/no-if": "warn"
  }
}

Note: the prettier, node, and cli configs do not have an "auto" config, as these don't typically require an override.