ESLint configuration for my projects.

ESLint config Cecilia is an opinionated shareable ESLint config used in my JavaScript projects (Vanilla.js, React.js or Node.js).

1. Goals
2. Installation
3. Credits
4. Contributing
5. Questions
6. License

• I want to use ESLint to lint my files
• I want to use Prettier to format my code
• I want to base my rules on the major configs, such as eslint-config-airbnb
• I want to keep the code clean and consistent across several projects
• I don't want to install/maintain/configure ESLint/Prettier/plugins/etc. independently in all projects

npm i -D eslint-config-cecilia
npx cecilia

1. Select "1" to install the necessary dependencies with npm
2. Select "y" to create the .eslintrc.js file
3. Select "y" to create the .prettierrc.js file
4. Select "y" to add the lint script commands in your package.json

yarn add --dev eslint-config-cecilia
yarn cecilia

1. Select "2" to install the necessary dependencies with Yarn
2. Select "y" to create the .eslintrc.js file
3. Select "y" to create the .prettierrc.js file
4. Select "y" to add the lint script commands in your package.json

npm i -D eslint-config-cecilia eslint prettier eslint-config-prettier eslint-plugin-prettier eslint-config-airbnb eslint-plugin-import eslint-plugin-jsdoc eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks eslint-plugin-unicorn

yarn add --dev eslint-config-cecilia eslint prettier eslint-config-prettier eslint-plugin-prettier eslint-config-airbnb eslint-plugin-import eslint-plugin-jsdoc eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks eslint-plugin-unicorn

Paste this code to extend the ESLint ruleset:

module.exports = {
  extends: 'cecilia',
}

Optional - Override Rules

For more information, see "Configuring Rules" in the ESLint Help.

module.exports = {
  extends: 'cecilia',
  rules: {
    //
    // rules to override.
    //
  }
}

Pro tip

Check the list of available rules.

Optional - Specifying Environments

For more information, see "Specifying Environments" in the ESLint Help.

module.exports = {
  extends: 'cecilia',
  env: {
    browser: true,
    node: true,
    ...
  },
}

module.exports = {
  semi: false,
  singleQuote: true,
  trailingComma: 'all',
}

Open the package.json file and add the following scripts entries:

  ...

  "scripts": {
    "lint": "eslint .",
    "lint:fix": "eslint . --fix",
    "format": "prettier --write './**/*.{js,jsx,json}'"
  },

  ...

yarn lint or npm run lint to lint your code.

yarn lint:fix or npm run lint:fix to lint and fix your code.

yarn format or npm run format to format your code.

Pro tip

Install ESLint and Prettier extensions for Visual Studio Code.

• Linting - ESLint
• Rules base config - eslint-config-airbnb
• Code formatter config - Prettier
• Plugin - eslint-plugin-import
• Plugin - eslint-plugin-jsdoc
• Plugin - eslint-plugin-jsx-a11y
• Plugin - eslint-plugin-prettier
• Plugin - eslint-plugin-react
• Plugin - eslint-plugin-react-hooks
• eslint-plugin-unicorn
• IDE coding style - EditorConfig
• Logo gear - made by Freepik from www.flaticon.com is licensed by CC 3.0 BY

Want to contribute? All contributions are welcome. Read the contributing guide.

If you have questions tweet me at @sandro_m_m or open an issue.

This project is licensed under the MIT License - see the LICENSE file for details

This project helped you? Please consider giving this repository a star ⭐.