Today I Learned
Go To Definition Error (feat.jsconfig.json)
** Go To Definition : IDE로 작업할 때
import SomeLayerTemplate from '@/components/Layer/SomeLayer.vue';
위와 같이 경로가 있을 때 Ctrl + Mouse 왼쪽 클릭 으로 해당 경로의 파일로 바로 가게 하는 기능이라고 알면 될 것 같다.
- vite와 vue를 쓰는 프로젝트를 진행하던 도중에
Go To Definition기능이 vscode(IDE)에서 동작하지 않는 에러를 마주쳤다. 이에 따라 다양한 방법을 찾아봤는데, 일단은vetur라는 vscode extention을 설치했고, vscode의 settings.json에"vetur.experimental.templateInterpolationService": true,이 설정을 추가해줬다. 그 결과
import { useSomeComposable } from '@/composables';
import LayerComponent from '@/components/Layer/LayerComponent.vue';위와 같은 alias import를 제외하곤 모든 부분에서 import가 정상적으로 되는 것을 확인할 수 있었다. 하지만, alias import 까지 돼야,, 하는게 아닌가 싶은 마음에 좀 더 알아봤고(사실 vite.config.js에
resolve: {
alias: {
'@': resolve(directoryName, './src/client/'),
},
},이미 위와 같은 옵션이 있기 때문에 정상적으로 작동해야 정상(?)이었지만,, 인터넷에 찾아보니 나와 같은 이슈가 꽤나 많았던 것 같다. 일단 webstorm을 쓰는 사람들한테서는 발생하지 않는 에러라는 점에서 살짝 서운한(?) 마음이 들긴 했다..ㅎㅎ. 어쨌든 결과적으로 vite.config.js의 설정을 제대로 인식하지 못하고 있다는 생각이 들었고, 그러면 Go To Definition 기능 활용을 위한 설정 중에 다른게 뭐가 있을까하다가 jsconfig.json을 찾게 됐다. 그래서 root 경로에
{
"compilerOptions": {
"baseUrl": "./",
"paths": {
"@/*": ["src/client/*"]
}
},
"include": ["src/client/**/*"]
}위와 같은 옵션으로 alias 경로에 대해 혹은 프로젝트 구조에 대해 인식할 수 있도록 일종의 언지를 주었더니 정상적으로 작동했다.
EACCES: permission denied
: 전에 토이 프로젝트를 할 때도 겪었던 것 같은데, 맥북에서 git clone 을 한다음에 이를 vscode로 실행할 때(즉, 프로젝트를 진행할 때), 위와 같은 혹은 아래 이미지와 같은 에러가 나는 케이스가 생겼다. 
: 이유는 심플하다. 해당 디렉터리에 대해서 권한이 없다는 것이다(에러 메시지 워딩 그대로). 따라서, 해당 디렉터리에 대해 권한을 가지면? 된다.
sudo chown -R <user-name> <directory-name>오랜만에 보는 ,,, 프롬프트 명령어,, 뒤의 directory-name에 해당하는 디렉터리에 user-name에 입력해준 유저가 권한을 갖게 하는 명령어라고 생각하면 된다.
sudo chown -R hong-yong-gi .이 명령어로 해결했다(실명 공개,,).
