오늘은 이클립스(Eclipse) IDE를 사용할 때 자바스크립트(javaScript) 에디터를 사용하는 법에 대하여 짧고 간단하게 포스팅해보고자 합니다.
해당 환경의 스크린샷 등은 STS(Spring Tool Suite 4 Version)에서 진행하였지만
이클립스 환경일때도 세팅법은 동일하기 때문에 따라서 해주시면 됩니다.
이클립스로 프로젝트를 진행하다 보면 가끔 나는 분명히 .JS 파일을 OPEN 하였지만
아래와 같이 아무런 에디터스러움 없이 그냥 흰 배경에 검정색 글자로만 주르륵 쓰여있고
자동완성이나 변수명, 함수명, 예약어 등에 기본 색표기 등이 전혀 없는 경우를 마주할 때가 있습니다.
[자바스크립트 에디터 설정 전]
[자바스크립트 에디터 설정 후]
이때 해당 파일을 잘 보시면 아래와 같이 기본 Text Editor로 열린 것을 알 수 있습니다.
이럴 때 이클립스 IDE에서 자바스크립트 에디터 설정을 해주면 자바스크립트에 맞춰진 하이라이트 처리 등이 진행되어 자바스크립트(JS) 개발을 할 때 다소 편하게 작업이 가능한 환경이 세팅됩니다.
간단하게 설정하는 법은 아래와 같습니다.
[1]. 가장 간단하게 해당 파일 1개만 JS Editor로 OPEN 하는 방법은 간단합니다.
- JS Editor 로 열고 싶은 파일을 마우스 오른쪽 클릭합니다.
- 오른쪽 메뉴에서 Open With 메뉴에 마우스를 올리면 옆에 메뉴가 더 생깁니다.
- 해당 메뉴에서 Generic Text Editor를 클릭하면 해당 .JS 파일이 JS Editor로 열립니다.
위와 같이 아주 간단하게 이클립스 내장 자바스크립트 에디터로 JS 파일을 열어보았습니다.
하지만 이런 방식은 파일 개별로 하나하나 마다 열어줘야 하기 때문에 굉장히 번거롭고 귀찮습니다.
한 번에 모든 .JS 파일을 JS 에디터로 여는 설정을 해두면 번거롭지 않게 자동으로 전역 처리가 됩니다.
[2]. 모든 JavaScript File을 JS Editor OPEN Setting 하는 법
- 이클립스 상단에 Window 메뉴 클릭
- Preferences 메뉴 클릭
- Preferences메뉴에서 General > Editors > File Associations 클릭
- 오른쪽 화면에 Add 버튼 클릭
- Add 후 나오는 창에서 " *.js " 입력 후 OK 버튼 클릭 ( *.js 입니다 ! )
- OK 버튼 누른 후 *.js 를 클릭하면 아래에 Associated editors라는 메뉴가 보입니다.
- 해당 메뉴에서 Add 버튼을 누릅니다.
- Generic이라고 검색하면 Generic Text Editor라는 메뉴가 보입니다.
- 클릭 후 OK 버튼을 눌러줍니다.
- 다시 아래 메뉴에서 추가된 Generic Text Editor에 포커스를 둔 후 오른쪽에 Default 버튼을 눌러줍니다.
- 버튼을 눌러주면 위와 같이 순서가 변경됩니다.
- 가장 하단에 Apply and Close 버튼을 눌러서 변경한 설정을 저장해주고 환경 설정 창에서 나옵니다.
- 아래와 같이 JS Editor로 설정되어 왼쪽 파일 그림이 JS 로 변경된것을 알 수 있습니다.
- 이제 어떤 JS 파일을 열던 모두 아래와 같이 JS Editor 로 열리게 됩니다.
이상으로 간단하게 이클립스 자바스크립트 에디터 설정하는 법을 알아보았습니다.
'IT > IT Tips' 카테고리의 다른 글
티스토리 블로그에 태그 페이지 추가하기 (tag page) (37) | 2020.03.07 |
---|---|
웹페이지 전체화면 한번에 캡쳐하기(Capture full size screenshot) (58) | 2020.02.24 |