My package.json file includes two commands:
"format": "prettier --write \"{src,{tests,mocks}}/**/*.{js,ts,vue}\"",
"lint": "eslint . -c .eslintrc.js --rulesdir eslint-internal-rules/ --ext .ts,.js,.vue,.tsx,.jsx --fix --ignore-path .gitignore",
After running npm run format and then npm run lint, I noticed a pattern:
npm run format- No issuesnpm run lint- Some files show changesnpm run format- Changes disappearednp run lint- Changes reappear
The changes introduced during npm run lint involve alterations in spacing and converting multi-line code into single lines. Examples can be seen here-
https://i.stack.imgur.com/PVrYD.png
https://i.stack.imgur.com/Oj6iH.png
https://i.stack.imgur.com/NRNwQ.png
It appears that Prettier's formatting choices are being overridden by Eslint based on its own rules.
This is the content of my .prettierrc file-
{
"semi": true,
"trailingComma": "none",
"singleQuote": true,
"printWidth": 80,
"arrowParens": "avoid"
}
And this is what is included in my .eslintrc.js file-
module.exports = {
...,
extends: [
...,
'prettier',
],
...,
plugins: [
...,
'prettier',
],
// Various ESLint rules listed here
},
settings: {
'import/resolver': {
node: {
extensions: ['.ts', '.js', '.tsx', '.jsx', '.mjs'],
},
typescript: {},
},
},
}
If no changes occur when running npm run format, how can I ensure that npm run lint follows the same formatting rules as Prettier to only flag linting errors, not formatting errors?