eslint-config-lux

An ESLint Config

Usage

1. Ensure ESLint is installed, all peer dependencies are installed, the configuration file is initiated, and the config package is installed

npm install --save-dev eslint@^7.18.0 # Install ESLint
npm install --save-dev eslint-plugin-import@^2.22.1 eslint-plugin-node@^11.1.0 eslint-plugin-promise@^4.2.1 # Install peer dependencies
npm install --save-dev eslint-config-lux # Install this package

npx eslint --init # Init config file

Or also with optional dependencies

npm install --save-dev @babel/core@^7.12.10 @babel/eslint-parser@^7.12.1 @babel/eslint-plugin@^7.12.1 # Babel

2. Extend the config in the config file

// In .eslintrc.js
module.exports = {
/*
  parserOptions: {
    parser: "babel-eslint"
  },
*/ // Use this if you want "babel-eslint" enabled

  extends: [
    // The "eslint-config-" prefix can be omitted
    "lux" // alias for "lux/base"
    // "lux/base",

    // "lux/import", // Rules for esm related rules, requires "eslint-plugin-import"
    // "lux/node", // Rules for Node.js related rules, requires "eslint-plugin-node"
 ]
};

3. Add npm tasks for code linting and fixing

// In package.json
{
  "scripts": {
    "lint": "eslint --ext .js --ignore-path .gitignore ./",
    "fix": "npm run lint -- --fix"
  }
}

Use the following instead if you are using Vue

// In package.json
{
  "scripts": {
    "lint": "eslint --ext .js,.vue --ignore-path .gitignore ./",
    "fix": "npm run lint -- --fix"
  }
}

4. Run linting and fixing for the first time and enforce the code styles

npm run fix

5. Extra configuration for editors

• Visual Studio Code

The ESLint plugin is needed.

{
  "eslint.validate": [
    "javascript"
  ],
  "editor.insertSpaces": false,
  "editor.detectIndentation": false,
  "editor.formatOnPaste": true,
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll": true
  },
  "javascript.format.insertSpaceBeforeFunctionParenthesis": false,
  "javascript.format.placeOpenBraceOnNewLineForControlBlocks": false,
  "javascript.format.placeOpenBraceOnNewLineForFunctions": false,
  "typescript.format.insertSpaceBeforeFunctionParenthesis": false,
  "typescript.format.placeOpenBraceOnNewLineForControlBlocks": false,
  "typescript.format.placeOpenBraceOnNewLineForFunctions": false,
  "eslint.lintTask.enable": true
}

...And also the following if you are using Vue

{
 "eslint.validate": [
  "vue"
 ],
 "vetur.validation.template": false
}

• EditorConfig

root = true

[*]
charset = utf-8
end_of_line = lf
indent_style = tab
indent_size = tab
insert_final_newline = true
trim_trailing_whitespace = true

• Others Please refer to ESLint Integrations Add ESLint Plugin Vue Editor integrations for Vue

6. Enjoy!