eslint-plugin-scissors

👮🏻 detect long call chains/nested expressions ✂️

🙋 say goodbye to 'NullPointerError' 💣

Introduction

The rule named 'nested-expressions' will lint the code in then/catch method, throw warning when detect nested expressions that would case NPE error.

The cost of using TypeScript and flow is high for many large, old projects who are struggling with type checking.Scissors✂️ provides non-intrusive type checking designed to expose all hazards at once.

It saves us more than a hundred hours of problem finding time and reduces the number of null pointer errors reported online by nearly 70% over the same period.Hope this will help you too.

🚫 Examples of incorrect code for this rule:

API.getList()
    .then(function (res) {
        this.result.add = res.data.add; // res.data could be null
     });

API.getList()
    .then((res) => {
        if (res.status === 0) {
            this.result = res.status && res.data.length ? res.data : []; // res.data could be null
        }
})

✅ Examples of correct code that have made fault-tolerant:

API.getList()
    .then(function (res) {
        this.result.add = res.data ? res.data.add : {};
    });


API.getList()
    .then(function (res) {
        if (res.data) {
            this.result.add = res.data.add;
        }
     });

API.getList()
    .then(function (res) {
        try {
            this.result.add = res.data.add;
        } catch (e) {
            // blabla
        }
     });

API.getList()
    .then(function (res) {
        if (res && res.status && res.data && res.data.page) {
            this.result.list = res.data.page.list;
        }
     });

Quickstart

Installation

Install ESLint and this plugin either locally or globally.

$ npm install eslint --save-dev
$ npm install eslint-plugin-scissors --save-dev

Configuration

Then add a reference to this plugin and selected rules in your eslint config:

{
  "plugins": [
    "scissors"
  ],
  "rules": {
    // default setting we recommended
    "scissors/nested-expressions": 1
  }
}

If you make sure that some variables using is absolutely safe(of course, there is no absolutely safe in development🙂), you can add these to white list to skip the plugin check:

  "rules": {
    // if you use Angular.js, maybe skipping '$scope' is useful
    "scissors/nested-expressions": [1, { "skip": ['$scope', 'window', 'this.queryForm'] }]
  }

Note the situation that use of the response value to rewrite the variable, it would cause NPE too.

Tips: If you want to lint the '.vue' file, you need to import eslint-plugin-vue:

  "plugins": [
    "vue",
    "scissors"
  ]

See Configuring Eslint on eslint.org for more info.

Recomended Usage

The first run, you're likely to receive a lot of warnings. dealing with all risks at once is hard, so suggest that you run eslint only on changes files using pre-commit and lint-staged:

"scripts": {
  "check-commit": "eslint",
  "lint-staged": "lint-staged"
},
"lint-staged": {
  "*.js": ["check-commit"],
  "*.vue": ["check-commit"]
},
"pre-commit": [
  "lint-staged"
]

If you use eslint-loader in Webpack, suggest that you set quiet option:

module.exports = {
  entry: "...",
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: "eslint-loader",
        options: {
          quiet: true,
        }
      },
    ],
  },
}

Contributing

Any issue and PR is super welcome!

1. Fork it!
2. Create your feature branch: git checkout -b my-new-feature
3. Commit your changes: git commit -am 'Add some feature'
4. Push to the branch: git push origin my-new-feature
5. Submit a pull request :D