vue로 tsx파일을 생성해서 코딩하고 있는데, prettier가 동작하지 않음을 발견했다.
한번 익숙해진 이후로 prettier를 포기못하기에,, tsx에서도 동작하게 하는 방법을 찾아보았다.
vscode의 세팅 파일 settings.json에서 아래와 같은 설정을 추가해주면 간단하게 해결된다.
// setings.json
{
"[typescriptreact]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
...
}
나는 아래와 같이 eslint를 설정해 두었다.
// .eslintrc.js
module.exports = {
env: {
node: true,
},
extends: [
'eslint:recommended',
'@vue/typescript/recommended',
'plugin:vue/vue3-recommended',
'@vue/prettier',
'@vue/prettier/@typescript-eslint',
],
globals: {
defineProps: 'readonly',
defineEmits: 'readonly',
defineExpose: 'readonly',
withDefaults: 'readonly',
},
rules: {
semi: ['error', 'never'],
},
}
당신께서 저의 오늘 하루를 구했습니다. 감사합니다!