New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

eslint-config-algolia

Package Overview
Dependencies
Maintainers
0
Versions
87
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

eslint-config-algolia

Algolia's ESLint config.

  • 23.2.1
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
1.3K
decreased by-25.18%
Maintainers
0
Weekly downloads
 
Created
Source

eslint-config-algolia

Version Build Status License Downloads

This is Algolia's linting and formatting of JavaScript projects (Vanilla, React, Vue) repository.

It explains to you how to setup your project to use it and never worry again about indentation, curly spaces, let vs const etc...

This code style is only as useful as you activate travis for your project so that it runs linting in your test phase and warns you.

Just focus on coding.

Table of Contents

Setup your project

Base requirements

yarn add \
eslint @babel/eslint-parser prettier \
eslint-config-algolia eslint-config-prettier \
eslint-plugin-import eslint-plugin-prettier \
@eslint-community/eslint-plugin-eslint-comments eslint-plugin-jsdoc \
--dev

Vanilla

.eslintrc.js

module.exports = {
  extends: 'algolia'
};

eslint.config.js

const algolia = require('eslint-config-algolia/flat/base');
module.exports = [
  ...algolia,
];

package.json

{
  "scripts": {
    "test": "npm run lint",
    "lint": "eslint .",
    "lint:fix": "npm run lint -- --fix"
  }
}

Jest

We recommend using Jest as a test runner.

terminal

yarn add eslint-plugin-jest --dev

.eslintrc.js

module.exports = {
  extends: ['algolia', 'algolia/jest']
};

eslint.config.js

const algolia = require('eslint-config-algolia/flat/base');
const algoliaJest = require('eslint-config-algolia/flat/jest');
module.exports = [
  ...algolia,
  ...algoliaJest,
];

package.json

{
  "scripts": {
    "test": "npm run lint",
    "lint": "eslint .",
    "lint:fix": "npm run lint -- --fix"
  }
}

React

terminal

yarn add eslint-plugin-react eslint-plugin-react-hooks eslint-plugin-jsx-a11y --dev

.eslintrc.js

module.exports = {
  extends: ['algolia', 'algolia/react']
};

eslint.config.js

const algolia = require('eslint-config-algolia/flat/base');
const algoliaReact = require('eslint-config-algolia/flat/react');
module.exports = [
  ...algolia,
  ...algoliaReact,
];

package.json

{
  "scripts": {
    "test": "npm run lint",
    "lint": "eslint .",
    "lint:fix": "npm run lint -- --fix"
  }
}

Flow (deprecated)

terminal

yarn add eslint-plugin-flowtype --dev

.eslintrc.js

module.exports = {
  extends: ['algolia', 'algolia/flowtype']
};

Flow with React (deprecated)

terminal

yarn add eslint-plugin-flowtype eslint-plugin-react eslint-plugin-react-hooks --dev

.eslintrc.js

module.exports = {
  extends: ['algolia', 'algolia/flowtype', 'algolia/react']
};

package.json

{
  "scripts": {
    "test": "npm run lint",
    "lint": "eslint .",
    "lint:fix": "npm run lint -- --fix"
  }
}

TypeScript

terminal

yarn add @typescript-eslint/parser @typescript-eslint/eslint-plugin typescript --dev

.eslintrc.js

module.exports = {
  extends: ['algolia', 'algolia/typescript'],

  parserOptions: {
    project: '<path-to-tsconfig.json>',
  },
};

eslint.config.js

const algolia = require('eslint-config-algolia/flat/base');
const algoliaTypescript = require('eslint-config-algolia/flat/typescript');
module.exports = [
  ...algolia,
  ...algoliaTypescript,
  {
    languageOptions: {
      parserOptions: {
        project: '<path-to-tsconfig.json>',
      },
    },
  },
];

package.json

{
  "scripts": {
    "test": "npm run lint",
    "lint": "eslint --ext .js,.ts,.tsx .",
    "lint:fix": "npm run lint -- --fix"
  }
}

You also need to make sure that all the files you want to lint are also included in tsconfig.json with the include property.

TypeScript with React

terminal

yarn add @typescript-eslint/parser @typescript-eslint/eslint-plugin typescript eslint-plugin-react eslint-plugin-react-hooks eslint-plugin-jsx-a11y --dev

.eslintrc.js

module.exports = {
  extends: ['algolia', 'algolia/react', 'algolia/typescript']
};

Note: Be sure to put the algolia/typescript configuration last so the parser is properly set for TypeScript files.

eslint.config.js

const algolia = require('eslint-config-algolia/flat/base');
const algoliaReact = require('eslint-config-algolia/flat/react');
const algoliaTypescript = require('eslint-config-algolia/flat/typescript');
module.exports = [
  ...algolia,
  ...algoliaReact,
  ...algoliaTypescript,
];

package.json

{
  "scripts": {
    "test": "npm run lint",
    "lint": "eslint --ext .js,.ts,.tsx .",
    "lint:fix": "npm run lint -- --fix"
  }
}

Vue

terminal

yarn add eslint-plugin-vue --dev

.eslintrc.js

module.exports = {
  extends: ['algolia', 'algolia/vue']
};

eslint.config.js

const algolia = require('eslint-config-algolia/flat/base');
const algoliaVue = require('eslint-config-algolia/flat/vue');
module.exports = [
  ...algolia,
  ...algoliaVue,
];

package.json

{
  "scripts": {
    "test": "npm run lint",
    "lint": "eslint --ext .js,.vue .",
    "lint:fix": "npm run lint -- --fix"
  }
}

VSCode

{
  "eslint.validate": [
    {
      "language": "vue",
      "autoFix": true
    }
  ]
}

Node.js

package.json

{
  "scripts": {
    "test": "npm run lint",
    "lint": "eslint .",
    "lint:fix": "npm run lint -- --fix"
  }
}

.eslintrc.js

module.exports = {
  extends: 'algolia',
  rules: {
    'import/no-commonjs': 'off'
  },
};

eslint.config.js

const algolia = require('eslint-config-algolia/flat/base');
module.exports = [
  ...algolia,
  {
    rules: {
      'import/no-commonjs': 'off'
    }
  },
];

Existing codebase setup

If you have a lot of files already written and wants to now use our linting tools, you might have a lot of errors. There's hope!

Just reformat all the files automatically and then manually fix remaining errors.

terminal

npm run lint:fix

Setup autofix in IDE

Don't overlook this part, autofixing on save is a huge productivity boost.

Use any ESLint integration and activate "Fix on save" option.

Also activate "Lint HTML files" when dealing with .vue components.

Ignoring files

See "Ignoring Files and Directories" on ESLint website.

Contributing

Test

We have a sample-project.

yarn test

Release

npm run release

Keywords

FAQs

Package last updated on 15 Oct 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc