Skip to content

edwmurph/eslint-config

Repository files navigation

eslint-config

npm version

My JavaScript Styleguide for ESLint.

Install

npm install @edwmurph/eslint-config --save-dev

Usage

Use npm scripts to lint JS, e.g. npm run lint:

"scripts": {
  "lint": "eslint .",
  "lint:fix": "eslint . --fix"
}

alternatively if you are using the Vue config, you'll also need to tell eslint to look for .vue files:

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

Add an .eslintrc.js file at the root of the repo extending the eslint config for the target project type

Node JS

module.exports = {
  root: true,
  extends: [
    '@edwmurph/eslint-config',
    // uncomment this if you are building a chrome extension
    // '@edwmurph/eslint-config/webextensions'
  ]
};

Gatsby JS

module.exports = {
  root: true,
  extends: [
    '@edwmurph/eslint-config/gatsby',
    // uncomment this if you are building a chrome extension
    // '@edwmurph/eslint-config/webextensions'
  ]
};

React

module.exports = {
  root: true,
  extends: [
    '@edwmurph/eslint-config/react',
    // uncomment this if you are building a chrome extension
    // '@edwmurph/eslint-config/webextensions'
  ]
};

NextJS

module.exports = {
  root: true,
  extends: [
    '@edwmurph/eslint-config/nextjs',
    // uncomment this if you are building a chrome extension
    // '@edwmurph/eslint-config/webextensions'
  ]
};

Vue 3

module.exports = {
  root: true,
  extends: [
    '@edwmurph/eslint-config/vue',
    // uncomment this if you are building a chrome extension
    // '@edwmurph/eslint-config/webextensions'
  ]
};

also for vue configs you need to update your lint scripts to look for vue files:

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

also currently eslint@8 is not compatible with @vue/[email protected] so you may temporarilly need to workaround this by also installing an older verison of eslint via:

npm install -d [email protected]