In my previous Vue projects I configured Webpack to run eslint with --fix
option to autofix indent, spaces, etc.. but in Nuxt seems this option is missing.
For example, the followings are the rules
is my .eslintrc.js
rules: {
indent: ['error', 4],
'space-before-function-paren': ['error', 'never'],
'key-spacing': ['error', {
beforeColon: true,
afterColon: true,
mode: 'minimum',
align: {
beforeColon: true,
afterColon: true,
on: 'colon'
}
}],
semi: ['error', 'always'],
'keyword-spacing': ['error', {
before: true,
after: true
}],
'brace-style': ['error', 'stroustrup']
},
For testing I change indentation in my error.vue
to 2 spaces :
export default {
name : 'nuxt-error',
props : ['error'],
head() {
return {
title : this.error.message || 'An error occured'
};
}
};
So, if I use the npm run lint
command (edited in "lint": "eslint --fix --ext .js,.vue --ignore-path .gitignore .",
) all works fine, and the code now has 4 spaces indentation.
But if I use the npm dev
command I have the following errors:
17:1 error Expected indentation of 4 spaces but found 2 indent
18:1 error Expected indentation of 4 spaces but found 2 indent
19:1 error Expected indentation of 4 spaces but found 2 indent
20:1 error Expected indentation of 8 spaces but found 4 indent
21:1 error Expected indentation of 12 spaces but found 6 indent
22:1 error Expected indentation of 8 spaces but found 4 indent
23:1 error Expected indentation of 4 spaces but found 2 indent
✖ 7 problems (7 errors, 0 warnings)
7 errors, 0 warnings potentially fixable with the `--fix` option.
How can I configure eslint in Nuxt commands to turn on the fix helper?
Thank you
<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1453">#c1453</a>)</em></sub></div>