misc-tslint-rules
Collection of miscellaneous TSLint rules
$ npm install tslint-misc-rules --save-dev
- Add the path to it to your tslint.json and add some rules:
Rules
- sort-imports [has autofix]
- prefer-es6-imports
- class-method-newlines [has autofix]
- jsx-attribute-spacing [has autofix]
- jsx-expression-spacing [has autofix]
- jsx-no-closing-bracket-newline [has autofix]
- jsx-no-braces-for-string-attributes [has autofix]
- react-lifecycle-order
- prefer-or-operator-over-ternary [has autofix]
- no-property-initializers
- camel-case-local-function
- declare-class-methods-after-use
- no-braces-for-single-line-arrow-functions [has autofix]
- no-unnecessary-parens-for-arrow-function-arguments
"sort-imports" ↑
Fails:
;;
Passes:
;;
Blocks are grouped, so this also passes:
;;testSetup;;;
Precedence is essentially *
, {
, then alpha, so:
;;;
This rule has one option, whitespace-insensitive
, that collapses all whitespace spans (including line breaks) down to one space when sorting. This provides compatibility with formatters like Prettier, which may decide to turn a single-line import into a multi-line import when it grows too long. This could otherwise introduce a lint failure. Ex:
"sort-imports":
Fails:
;;
Passes:
;;
"prefer-es6-imports" ↑
With configuration (required):
Fails:
;;;
"class-method-newlines" ↑
Ensure each method in class is preceded by a newline.
Fails:
Passes:
The first method is exempt, so this also passes:
"jsx-attribute-spacing" ↑
Fails:
<div = /><div = /><div =/>
Passes:
<div =/>
"jsx-expression-spacing" ↑
Fails:
<div =/><div =/><div =/><div> value value value </div>
Passes:
<div =/><div> value </div>
"jsx-no-closing-bracket-newline" ↑
Fails:
<a ="asdf" ="/foo" /> <div ="qwer" ="asdf" > text </div>
Passes:
<a ="asdf" ="/foo" /> <div ="qwer" ="asdf"> text </div>
"jsx-no-braces-for-string-attributes" ↑
Fails:
<div =/>
Passes:
<div ="value"/>
"react-lifecycle-order" ↑
With configuration (optional):
Fails:
Passes:
If configuration is not specified, React's invocation order is used.
"prefer-or-operator-over-ternary" ↑
Fails:
;
Passes:
;
"no-property-initializers" ↑
Fails:
Passes:
"camel-case-local-functions" ↑
Due to React's Stateless Functional Components, this rule checks callsites rather than declarations.
Fails:
; FooImport;FooDeclaration;
Passes:
import fooImport from 'foo'; { } { return null; } ;;const el = </SomeSFC>;
"declare-class-methods-after-use" ↑
Fails:
Passes:
"no-braces-for-single-line-arrow-functions" ↑
Fails:
;;
Passes:
;;
"no-unnecessary-parens-for-arrow-function-arguments" ↑
Fails:
;
Passes:
;