--fix doesn't fix the errors using eslint

Question

I'm using eslint in visual code to format the js files but it gives me errors everytime i run it, here's my command line to run it node ./node_modules/eslint/bin/eslint -- src --fix the error message

E:\PATH\src\reducers\roote-reducer.js
  1:8   error  There should be no space after '{'                object-curly-spacing
  1:26  error  There should be no space before '}'               object-curly-spacing
  6:1   error  Expected indentation of 1 tab but found 2 spaces  indent
  7:1   error  Expected indentation of 1 tab but found 2 spaces  indent
  8:4   error  Newline required at end of file but not found     eol-last

E:\PATH\src\reducers\schedule-reducer.js
   1:8   error  There should be no space after '{'                  object-curly-spacing
   1:22  error  There should be no space before '}'                 object-curly-spacing
   4:1   error  Expected indentation of 1 tab but found 4 spaces    indent
   7:24  error  Missing space before function parentheses           space-before-function-paren
   7:54  error  Missing space before opening brace                  space-before-blocks
   8:1   error  Expected indentation of 1 tab but found 4 spaces    indent
   9:1   error  Expected indentation of 1 tab but found 4 spaces    indent

E:\PATH\src\register-service-worker.js
   12:1  error  Expected indentation of 1 tab but found 2 spaces    indent
   17:1  error  Expected indentation of 5 tabs but found 6 spaces   indent
   17:7  error  Use regex shorthands to improve readability         unicorn/regex-shorthand
   22:1  error  Expected indentation of 1 tab but found 2 spaces    indent

✖ 309 problems (309 errors, 0 warnings)
  309 errors, 0 warnings potentially fixable with the `--fix` option.

How can i fix them automatically?

Note that not all errors/warnings are fixable by `--fix` – piuspbd Jul 10 '18 at 12:42 — piuspbd, Jul 10 '18 at 12:42
How can to fix this errors/warnings? – gretty volk Jul 10 '18 at 12:43 — gretty volk, Jul 10 '18 at 12:43

score 63 · Answer 1 · edited Mar 14 '21 at 09:40

63

To use --fix option, you need to run eslint directly.

Try this

./node_modules/.bin/eslint src --fix

On Windows:

.\node_modules\.bin\eslint src\** --fix

edited Mar 14 '21 at 09:40

Mr. Doge

796
5
11

answered Jul 10 '18 at 12:48

piuspbd

993
7
16

6

it doesn't work correctly, it give just one error (the first error), and didn't solve it! – gretty volk Jul 10 '18 at 12:54
Edited, can you tell more about the issue? – piuspbd Jul 10 '18 at 13:46
Please try to explain your solution a bit so that people can understand why the issue occurs and what the actual problem & solution is. – Scriptable Jul 10 '18 at 14:16
4

This worked for me after I specified a directory as the last argument, after `--fix`, eg: `./node_modules/.bin/eslint --fix myJsFiles/`. Thanks – Gene Bo Sep 24 '19 at 22:03
There is no need to run binaries directly from `./node_modules/.bin`. This is what `npx` and `npm exec` are for. – Cameron Tacklind Jul 02 '21 at 21:47
And if you are a lover of **yarn**, use `yarn eslint src --fix`. Thank me later! – Joshua Kusaasira Mar 08 '22 at 00:26

CodeBiker · Answer 2 · 2019-02-06T02:32:47.143

15

The format should be:

./node_modules/.bin/eslint --fix path/to/file.js

See this thread (and aravind1078's answer) for more background.

edited Feb 06 '19 at 02:32

answered Jan 30 '19 at 16:50

CodeBiker

2,985
2
33
36

I used ./node_modules/.bin/eslint --fix src/**.* to run on all files inside /src – walox Jul 19 '19 at 10:04

score 11 · Answer 3 · answered Jun 09 '20 at 07:48

11

Run the below command in the new terminal:

./node_modules/.bin/eslint --fix . --ext .js,.vue src

answered Jun 09 '20 at 07:48

Aeolian7

326
4
9

score 8 · Answer 4 · answered Apr 15 '20 at 09:45

8

Try to run

eslint --fix

you have to install first eslint

npm install -g eslint

answered Apr 15 '20 at 09:45

Rohan

640
7
11

Thanks. That solved my problem as well. Run into this and tried to debug for almost 1 hr – Jose Mhlanga Apr 18 '20 at 09:11
Hero! Might I add using the `.` at the end. Thanks a bunch! – Huthaifa Muayyad Mar 31 '21 at 13:51

Ahmed Maher · Answer 5 · 2020-10-05T04:59:27.817

6

in the directory in which you code exists run :

eslint --fix .

instead of

eslint --fix

as the command needs an argument which indicates the directory in which the code exists or the file itself you want to apply linting on

edited Oct 05 '20 at 04:59

answered Oct 04 '20 at 11:31

Ahmed Maher

1,521
17
22

I had to specify the file(s) explicitly, e.g. `eslint --fix src/path/some.js`. The above didn't scan the directories for files. – armandino Jan 18 '23 at 21:28

score 6 · Answer 6 · answered Dec 28 '20 at 14:43

6

Use Command-Line Terminal, to run the below commands in Visual Studio Code.

Make sure .eslintrc.yml file configured for the working project

To fix lint issues in a file

npx eslint file1.js --fix

To fix lint issues in all the files in the folder

npx eslint ./folder_name --fix

answered Dec 28 '20 at 14:43

Saravanan Selvamohan

314
3
4

For some reason this was the only solution that worked for me... thanks so much! – Lily Hahn Jun 07 '21 at 16:13
3

Doesn't work for me – Nienaber Dec 09 '21 at 08:59

score 4 · Answer 7 · answered Mar 17 '21 at 15:05

I had difficulties in using --fix when I use eslint-config-airbnb-base instead of @nuxtjs/eslint-module in Nuxt.js project
At that time running eslint direclty worked for me: ./node_modules/.bin/eslint --fix

However, my preferred one is to write two more scripts into package.json

"lint": "eslint --ext \".js,.vue\" --ignore-path .gitignore .",
"lint-fix": "npm run lint -- --fix"

And run yarn lint-fix or npm run lint-fix

av123 · Answer 8 · 2020-08-18T04:45:03.407

3

First install eslint if you already haven't

npm install -g eslint

Then run

eslint --fix path/to/file.extension

Note: You will have to run the the above command every time after making changes to that particular file.

edited Aug 18 '20 at 04:45

answered Aug 10 '20 at 14:08

av123

31
3

score 2 · Answer 9 · answered Feb 22 '20 at 17:11

If it didn't

extend(config, ctx) {
      // Run ESLint on save
      if (ctx.isDev && ctx.isClient) {
        config.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /(node_modules)/,
          options: {
            fix: true
          }
        })
      }
    }
You. You can use this on the first page
    const colors = require('vuetify/es5/util/colors').default
    const pkg = require('./package')
    require('dotenv').config()

    module.exports = {
      mode: 'universal',
      /*
      ** Headers of the page
      */
      head: {
        titleTemplate: '%s - ' + process.env.npm_package_name,
        title: process.env.npm_package_name || '',
        meta: [
          { charset: 'utf-8' },
          { name: 'viewport', content: 'width=device-width, initial-scale=1' },
          {
            hid: 'description',
            name: 'description',
            content: process.env.npm_package_description || ''
          }
        ],
        link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }]
      },
      /*
      ** Customize the progress-bar color
      */
      loading: { color: '#fff' },
      /*
      ** Global CSS
      */
      css: [],
      /*
      ** Plugins to load before mounting the App
      */
      plugins: [],
      /*
      ** Nuxt.js dev-modules
      */
      buildModules: [
        // Doc: https://github.com/nuxt-community/eslint-module
        '@nuxtjs/eslint-module',
        '@nuxtjs/vuetify'
      ],
      /*
      ** Nuxt.js modules
      */
      modules: [
        // Doc: https://axios.nuxtjs.org/usage
        '@nuxtjs/axios',
        '@nuxtjs/pwa',
        // Doc: https://github.com/nuxt-community/dotenv-module
        '@nuxtjs/dotenv'
      ],
      /*
      ** Axios module configuration
      ** See https://axios.nuxtjs.org/options
      */
      axios: {},
      /*
      ** vuetify module configuration
      ** https://github.com/nuxt-community/vuetify-module
      */
      /*
      ** Build configuration
      */
      build: {
        extend(config, ctx) {
          // Run ESLint on save
          if (ctx.isDev && ctx.isClient) {
            config.module.rules.push({
              enforce: 'pre',
              test: /\.(js|vue)$/,
              loader: 'eslint-loader',
              exclude: /(node_modules)/,
              options: {
                fix: true
              }
            })
          }
        }
      }
    }

If you still don't understand me.

This fixed the issue in my Nuxt Project, Thanks a lot – Annamalai D Jul 10 '20 at 16:28 — Annamalai D, Jul 10 '20 at 16:28

score 1 · Answer 10 · answered Apr 16 '20 at 21:03

1

I just had the same problem I run

eslint --fix fileName.extention

answered Apr 16 '20 at 21:03

Christopher Lowe

101
1
5

score 1 · Answer 11 · answered Jul 22 '20 at 11:34

1

First Install Package: npm install -g eslint

and

Run: eslint --fix

answered Jul 22 '20 at 11:34

subash sapkota

81
4

score 1 · Answer 12 · answered Jun 03 '22 at 00:48

1

if it doesn't fix any error with the '--fix' flag, it means your ESlint config file has an error. please cross check the file again

answered Jun 03 '22 at 00:48

s__mc

42
4

--fix doesn't fix the errors using eslint

12 Answers12