Code Monkey home page Code Monkey logo

eslint-plugin-destructuring's Introduction

ESLint-Plugin-Destructuring

Maintenance Status NPM version Build Status

Destructuring-specific linting rules for ESLint.

Installation

Install ESLint either locally or globally.

$ npm install eslint

If you installed ESLint globally, you have to install the plugin globally too. Otherwise, install it locally.

$ npm install eslint-plugin-destructuring

Configuration

Add a plugins section and specify eslint-plugin-destructuring as a plugin.

Then, enable all of the rules that you would like to use.

Recommended configuration

This plugin exports a recommended configuration that enforces all the rules. You can configure the plugin as follows:

{
  "plugins": ["destructuring"],
  "extends": ["plugin:destructuring/recommended"]
}

List of provided rules

Rules are divided into categories for your convenience. All rules are off by default, unless you use one of the plugin's configurations which turn all relevant rules on.

Stylistic Issues

These rules are purely matters of style and are quite subjective.

  • no-rename: Forbid rename syntax when object destructuring.
  • in-params: Configure destructuring within parameters.
  • in-methods-params: Forbid destructuring within method parameters.

Contributing

Contributions are always welcome!.

License

eslint-plugin-destructuring is licensed under the MIT License.

eslint-plugin-destructuring's People

Contributors

aretecode avatar greenkeeperio-bot avatar lukeapage avatar lukpsaxo avatar mikkeltn avatar nlight avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

eslint-plugin-destructuring's Issues

Doesn't detect parameter destructuring when the parameter has a default value.

Destructuring is a warning in all parameters.

{
  "rules": {
    "destructuring/in-params": ["warn", { "max-params": 0 }]
  }
}

This doesn't show a warning:

const createConnectMiddleware = <TArgs extends readonly unknown[]>(
  id: string,
  factory: (...args: TArgs) => (req: IncomingMessage, res: ServerResponse, next: (error?: unknown) => void) => void,
  { timeoutSeconds = 3 }: MiddlewareConnectOptions = {},
): MiddlewareFactory<TArgs> => {
  ...
}

This does show a warning:

const createConnectMiddleware = <TArgs extends readonly unknown[]>(
  id: string,
  factory: (...args: TArgs) => (req: IncomingMessage, res: ServerResponse, next: (error?: unknown) => void) => void,
  { timeoutSeconds = 3 }: MiddlewareConnectOptions,
): MiddlewareFactory<TArgs> => {
  ...
}

Difference:

{ timeoutSeconds = 3 }: MiddlewareConnectOptions = {},
{ timeoutSeconds = 3 }: MiddlewareConnectOptions

How to limit the maximum number of variables destructured in the function signature?

The guide says:

The following patterns are not considered warnings:

/*eslint destructuring/in-params: ["error", { "max-params" : 1}]*/

function t1({a}) {}
function t2(a, b) {
  const {c} = a;
  const {d} = b;
}
const t3 = ({a}) => a;

But this is also valid:

function t3({ a, b, c, d, e}) {}

I would expect to be able to set the maximum number of destructured variables, so that one is forced to rewrite t3 as follows:

function t3(params) {
   const { a, b, c, d, e} = params;
}

This is a common issue with functional React components, where someone starts with a few parameters destructured in the function signature:

const MyReactComponent: FC<MyReactComponentProps> = ({ aProp, orTwo }) => {
   ...
}

Then over time, as different people keep adding features to that component, they put and more props into the function signature that becomes a multi-line monstrosity eventually, without bothering to move the destructuring to a function body.

It would be very handy to have a rule that allows up to a certain number of variables in the destructuting block.

Is there already a way to do it?

Abandoned?

Hey Luke!

Are you still supporting the plugin? We're thinking of banning destructuring in class methods I thought of creating a PR rather than creating a new plugin. Please tell me what do you think?

Best,
Dima

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.