When we write large projects such as React and Vue, or use the framework to build small programs, in order to facilitate the collaborative development of multiple people, we often introduce ESlint to standardize the code writing, so that different developers can write unified code. For native applet projects, we may not need to use module packaging tools such as webpack, but we can also configure appropriate ESlint specifications for code management.

The steps to configure ESlint are summarized as follows:

cd to our project, install ESlint:
cnpm install eslint --save-dev
2. Create the ESlint configuration file.eslintrc.js:

eslint --init

The above options can be entered all the way. These are the eslint rules used. You can customize them later.

1. Perform eslint:

After the. eslintrc.js file is generated, we can use basic commands to standardize our code, such as:

eslint --fix pages/index/index.js
Of course, if you use the syntax of ES6, the following error will be reported after the above command is executed:

Parsing error: Unexpected token = ***
The reason is that the development environment is not compatible with the current parsing function of ESLint, so we need to carry out the next step;

1. To install Babel eslint:

cnpm install babel-eslint --save-dev
After installation, add configuration: "parser": "Babel eslint" in. eslintrc;

1. . eslintrc.js file other configurations:

module.exports = {
"env": {
"browser": true,
"node": true,
"es6": true, / / no error will be reported with require
"commonjs": true
},
//Configure parser
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
},

"extends": "eslint:recommended",
//Global variable
"globals": {
"DEV": true,
"WECHAT": true,
"ALIPAY": true,
"App": true,
"Page": true,
"Component": true,
"Behavior": true,
"wx": true,
"getApp": true,
"getCurrentPages": true,
},
/**

• "off" or 0 - close rule
• "Warn" or 1 - turn on the rule, using a warning level error: warn (does not cause the program to exit),
• "Error" or 2 - turn on the rule, use error level error: error (when triggered, the program exits)
  */
  "rules": {
  //Force consistent indentation
  "indent": [
  "error", 2
  ],
  //Enforce consistent line feed style
  "linebreak-style": [
  "error",
  "unix"
  ],
  //Force consistent backslashes, double quotes, or single quotes
  "quotes": [
  "error",
  "single" // backtick,double,single
  ],
  //Semicolons are required or prohibited to replace ASI
  "semi": [
  "error",
  "always"
  ],
  "no-console": [
  "off", {
  "Allow": ["log", "warn", "error", "info] / /" allow "is an array of strings containing the methods of the allowed console objects
  }
  ],
  //Disallow mixed indentation of spaces and tab s
  "no-mixed-spaces-and-tabs": [
  "error", "smart-tabs"
  ],
  //Force a consistent space before the opening parenthesis of a function
  "space-before-function-paren": [2, "always"],
  //Disallow or force spaces in single line code blocks (disabled)
  "block-spacing": [1, "never"],

"no-cond-assign": 2,
// Disable duplicate parameter in function definition
"no-dupe-args": 2,
// Disable duplicate key in object literal
"no-dupe-keys": 2,
// Prohibit duplicate case labels
"no-duplicate-case": 2,
// Prohibit empty statement block
"no-empty": 2,
// Prohibit parameter reassignment of catch clause
"no-ex-assign": 2,
// Prohibit unnecessary Boolean conversion
"no-extra-boolean-cast": 2,
// Prohibit unnecessary brackets / / (a * b) + c; / / error
"no-extra-parens": 0,

//Enforce consistent bracket style for all control statements
"curly": [2, "all"],
// The parameter of the disable catch clause has the same name as the variable in the outer scope
"no-catch-shadow": 0,
// Label with same name as variable is not allowed
"no-label-var": 2,
// Disable specific global variables
"no-restricted-globals": 2,
// Disable var declaration to have the same name as a variable in the outer scope
"no-shadow": 0,
// Disable overwriting restricted identifiers
"no-shadow-restricted-names": 2,
// Disable initializing variables to undefined
"no-undef-init": 2,
// undefined is not allowed as an identifier
"no-undefined": 0,
// Variables are not allowed to be used before they are defined
"no-use-before-define": 0,
//////////////
// Style guide//
//////////////
// Specify that the elements of the array should be separated by spaces (, after), the never parameter: [before and] cannot be followed by spaces, and the always parameter: [before and] must be followed by spaces
"array-bracket-spacing": [2, "never"],
//When the second parameter of force consistent indentation is "tab", tab is used.
// The {after if while function must be on the same line as if, java style.
"brace-style": [2, "1tbs", {
  "allowSingleLine": true
}],
// Control spaces before and after commas
"comma-spacing": [2, {
  "before": false,
  "after": true
}],
// Controls whether commas appear at the end of a line or at the beginning of a line (default line end)
// http://eslint.org/docs/rules/comma-style
"comma-style": [2, "last"],
//'switch case' (default: 0) forces the indentation level of the case clause in the switch statement
// If spaces are required before [and] when using square brackets to get object properties, the optional parameters are never, always
"computed-property-spacing": [2, "never"],
// It refers to the variable name that points to this in the callback function. This in the arrow function can point to the outer caller. It should be useless.
// e.g [0,"self"] specifies that only var that = this. self cannot point to any other value, nor can this be assigned to any value other than self.
"consistent-this": [2, "self", "that", "_self", "_that", "me", "_this"],
// Force named function expression
"func-names": 0,
// Force wrap at end of file
"eol-last": 0,
//A space between the function identifier and its call is required or prohibited
"func-call-spacing": 2,
// Force a consistent spacing between keys and values in an object literal property
"key-spacing": [2, {
  "beforeColon": false,
  "afterColon": true
}],
// Requires a blank line around the comment (requires a blank line before the block level comment)
"lines-around-comment": [2, {
  "beforeBlockComment": true
}],
"func-style": 0,
// Force the maximum nesting depth of callback function to 5 layers
"max-nested-callbacks": [2, 5],
// Disable the specified identifier
"id-blacklist": 0,
// Force the latest and maximum length of identifiers
"id-length": 0,
// Require identifier to match a specified regular expression
"id-match": 0,
// Force consistent use of double or single quotes in JSX properties
"jsx-quotes": 0,
// Force consistent spaces before and after keywords (required before and after waist)
"keyword-spacing": 2,
// Force maximum rows
"max-lines": 0,
// Force the maximum number of parameters allowed in the function definition
"max-params": [1, 5],
// Force the maximum number of statements allowed for a function block
"max-statements": [1, 200],
// Force the maximum number of statements allowed per line
"max-statements-per-line": 0,
// Requires the constructor to be capitalized (requires a function with an initial size when calling the new operator, and allows the function to be called without a new operator.)
"new-cap": [2, {
  "newIsCap": true,
  "capIsNew": false
}],
// Parentheses are required when calling a parameterless constructor
"new-parens": 2,
// A blank line after the var declaration statement is required or prohibited
"newline-after-var": 0,
// Array constructor prohibited
"no-array-constructor": 2,
// Disable bitwise operators
"no-bitwise": 0,
// A blank line is required before the return statement
"newline-before-return": 0,
// Requires a line break for each call in the method chain
"newline-per-chained-call": 1,
// Disable continue statement
"no-continue": 0,
// Prohibit inline comments after lines of code
"no-inline-comments": 0,
// Forbid if as the only statement in else statement
"no-lonely-if": 0,
// Prohibit mixing different operators
"no-mixed-operators": 0,
// Multiple blank lines are not allowed
"no-multiple-empty-lines": [2, {
  "max": 2
}],
// Negative expression not allowed
"no-negated-condition": 0,
// Nested ternary expressions are not allowed
"no-nested-ternary": 0,
// Disable constructor of Object
"no-new-object": 2,
// Disable unary operators + + and--
"no-plusplus": 0,
// Prohibit specific syntax
"no-restricted-syntax": 0,
// Prevent spaces between function identifiers and parentheses
"no-spaced-func": 2,
// Ternary operators are not allowed
"no-ternary": 0,
// Disable space at end of line
"no-trailing-spaces": 2,
// Suppress dangling underscores in identifiers \
"no-underscore-dangle": 0,
// Prohibit the use of ternary operators when there are simpler alternative expressions
"no-unneeded-ternary": 2,
// Blank before prohibited attribute
"no-whitespace-before-property": 2,
// Require or prohibit wrapping around var declaration
"one-var-declaration-per-line": 0,
// Require or prohibit the use of simplified assignment operators where possible
"operator-assignment": 0,
// Force operators to use consistent line breaks
"operator-linebreak": [2, "after", {
  "overrides": {
    "?": "before",
    ":": "before"
  }
}],
// Block filling required or prohibited
"padded-blocks": 0,
// Require object literal attribute names to be enclosed in quotation marks
"quote-props": 0,
// JSDoc comments required
"require-jsdoc": 0,
// Semicolons instead of ASI are required or prohibited.
// "semi": [2, "always"],
// Force consistent spaces before and after semicolons
"semi-spacing": 2,
// Require variables in the same declaration block to be ordered
"sort-vars": 0,
// Force consistent spaces before blocks
"space-before-blocks": [2, "always"],
// Force consistent spaces within parentheses
"space-in-parens": [2, "never"],
// Require spaces around operators
"space-infix-ops": 2,
// Force consistent spaces before and after unary operators
"space-unary-ops": [2, {
  "words": true,
  "nonwords": false
}],
// Force consistent spaces in comments / / or / *.
"spaced-comment": [2, "always", {
  "markers": ["global", "globals", "eslint", "eslint-disable", "*package", "!"]
}],
// Unicode BOM required or prohibited
"unicode-bom": 2,
// Regular expressions are required to be enclosed in parentheses
"wrap-regex": 0,
//Prevent lexical declarations (let, const, function, and class) from appearing in case or default clauses
"no-case-declarations": ["warn"],

//////////////
// ES6. Relevant//
//////////////
// Only one import can be used per module
"no-duplicate-imports": 2,
// Expecting curly braces for arrow function bodies
"arrow-body-style": 2,
// Parentheses are required for arguments to arrow functions
"arrow-parens": 2,
"arrow-spacing": [2, {
  "before": true,
  "after": true
}],
// Force a consistent space around the * sign in the generator function
"generator-star-spacing": [2, {
  "before": true,
  "after": true
}],
// Variables declared by class cannot be modified
"no-class-assign": 2,
// The arrow function is not allowed, where they can confuse the comparison
"no-confusing-arrow": 0,
// Variables declared by const cannot be modified
"no-const-assign": 2,
// Prohibit duplicate names in class members
"no-dupe-class-members": 2,
// Disable Symbolnew operator with new
"no-new-symbol": 2,
// Allow to specify the import when the module is loaded
"no-restricted-imports": 0,
// Prohibit using this or super before calling super() in the constructor
"no-this-before-super": 2,
// Suppress unnecessary calculation of text for performance key objects
"no-useless-computed-key": 0,
// let or const instead of var is required
"no-var": 1,
// Require or disable shorthand syntax for methods and properties in object literals
"object-shorthand": 0,
// Require arrow function as callback
"prefer-arrow-callback": 0,
// Require const to declare variables that are no longer modified after declaration
"prefer-const": 0,
// Require reflection method to be used where appropriate
"prefer-reflect": 0,
// Extension operator required instead of. apply()
"prefer-spread": 0,
// Require template literals instead of string concatenation
"prefer-template": 0,
// Suggest using the rest parameters instead of arguments
"prefer-rest-params": 0,
// Require yield in generator function
"require-yield": 2,
// Requires or disables the use of spaces around embedded expressions in Template Strings
"template-curly-spacing": 1,
// Force spaces around * in yield * expressions
"yield-star-spacing": 2,
// Trailing commas are required or prohibited
"comma-dangle": 2,
// Prohibit constant expressions in conditions
"no-constant-condition": 0,
// Force the maximum length of a row
"max-len": [0, 200, {"ignoreUrls": true}],
// Prohibit unused variables
"no-unused-vars": [0, {
  "vars": "all",// All detects all variables, including those in the global environment. This is the default.
  "args": "none" // none - do not check parameters.
}],

}
};
6. Create the package.json optimization project:

{
"name": "project name",
"version": "1.0.0",
"description": "eslint project",
"scripts": {
"lint": "eslint --fix app.js api.js components pages utils"
},
"devDependencies": {
"babel-eslint": "^10.0.3",
"eslint": "^6.4.0"
},
"license": "ISC",
"author": "your name",
"repository": {
"type": "git",
"url": "your project git url"
}
}
After creating the package.json file, you can execute the following command to eslint manage the specified file:

npm run lint