I'm facing an issue with my code block that appears like this:
this.$api
.get<AxiosResponse<Resource>>('/resources/', {
params: {
pageNumber: 1,
pageLength: 10,
}
});
For some reason, my typescript ESLint is automatically formatting the codeblock as shown below:
this.$api
.get<AxiosResponse<Resource>>('/resources/', {
params: {
pageNumber: 1,
pageLength: 10,
}
});
This formatting is causing confusion and I don't find it ideal. A similar issue has been discussed for @typescript-eslint here.
What steps can I take to update my ESLint configuration to prevent this behavior?
Here's my current ESLint configuration:
/* eslint-env node */
require('@rushstack/eslint-patch/modern-module-resolution');
module.exports = {
root: true,
extends: [
'plugin:vue/vue3-essential',
'eslint:recommended',
'@vue/eslint-config-typescript/recommended',
],
env: {
'vue/setup-compiler-macros': true,
},
overrides: [
{
files: ['cypress/integration/**.spec.{js,ts,jsx,tsx}'],
extends: ['plugin:cypress/recommended'],
},
],
rules: {
quotes: [2, 'single', { avoidEscape: true }],
indent: 'off',
'@typescript-eslint/no-unused-vars': 'off',
... (Remaining content abbreviated for brevity)
}
};