서브라임 텍스트를 탐색기 우클릭 메뉴에 추가해서 접근성을 높여보자.

OpenWithSublime Gist에서 실행파일을 다운로드 받는다.

압축 푼 파일을 서브라임 텍스트가 깔려있는 경로에 넣어준다.

OpenWithSublime.bat 파일을 실행한다.

확인

이제 폴더나 파일을 바로 서브라임 텍스트로 열 수 있다.

서브라임 텍스트에서 단축키를 수정해보자.

Preferences > Key Bindings 메뉴를 들어간다. Default 와 User 로 나눠진 창에서 User 창에 내 단축키를 등록하면 된다.

단축키

다른 환경과 호환되는 사용하기 편한 단축키

[
  // ctrl+d 로 줄삭제
  {
    keys: ["ctrl+d"],
    command: "run_macro_file",
    args: { file: "res://Packages/Default/Delete Line.sublime-macro" },
  },
  // 기존 ctrl+d의 기능을 옮김
  { keys: ["ctrl+shift+k"], command: "find_under_expand" },
  { keys: ["ctrl+k", "ctrl+shift+k"], command: "find_under_expand_skip" },
  // 들여쓰기 활성화
  { keys: ["f12"], command: "reindent", args: { single_line: false } },
  // 파일 새로고침
  { keys: ["f5"], command: "revert" },
  // f1키 누를시 package controller 띄우기 (기존 ctrl+shift+p 기능)
  {
    keys: ["f1"],
    command: "show_overlay",
    args: { overlay: "command_palette" },
  },
  // terminal package가 있을시 현재 프로젝트 터미널 띄우기
  { keys: ["ctrl+alt+t"], command: "open_terminal_project_folder" },
  // sidebarEnhancement package가 있을시 파일명 변경
  { keys: ["f2"], command: "side_bar_rename" },
  // sidebarEnhancement package가 있을시 새 파일 생성
  { keys: ["ctrl+n"], command: "side_bar_new_file2" },
];

서브라임 텍스트 사용시 쓸만한 패키지를 모아봤다.

진하게 표시가 된 패키지들은 필수로 설치하는걸 추천한다.

Ctrl+Shift+P로 패키지 매니저를 띄운뒤 WW를 입력해 Word Wrap Toggle 기능을 활성/비활성화 한다.

적용전​

적용후​

실수로라도 Ctrl+Shift+C 키를 누르면 소스가 GBK 중국어 인코딩으로 바뀌어 저장된다. 이 단축키의 기본 설정을 UTF-8로 변경해보자.

패키지 경로 이동​

C:\Users\사용자 폴더\AppData\Roaming\Sublime Text3\Packages\ConvertToUTF8

기본 설정파일 변경​

Default (Windows).sublime-keymap 파일을 열고 아래와 같이 수정한다.

[
  {
    keys: ["ctrl+shift+c"],
    command: "convert_to_uft8",
    args: { encoding: "UTF-8", stamp: 0 },
  },
];

또는 파일 내용을 날려버려도 된다.

패키지 설치​

Package Control을 열어 Terminal 패키지를 설치한다.

Git Bash 와의 연동​

Preferences > Package Settings > Terminal > Settings - User 메뉴에서 터미널 경로를 수정한다.

{
  // git-bash가 설치된 경로
  "terminal": "C:\\Program Files\\Git\\git-bash.exe",
  "parameters": []
}

단축키 추가

기본 단축키는 ctrl+shift+alt+t 라 어려우니 변경해주자. Preferences > Key Bindings 메뉴에서 단축키를 추가한다.

{ "keys": ["ctrl+alt+t"], "command": "open_terminal_project_folder" }

이제 ctrl+alt+t 키로 현재 프로젝트에서 깃 배쉬창을 바로 띄울 수 있다.

javascript 에서 linter 의 역활은 중요하다. Sublime Text 나 VSCode 에서 jshint linter 를 설치하고, 기본 설정을 수정해보자.

Sublime​

모듈 설치​

Sublime Linter 패키지가 선행되어야한다.

Package Control을 열어 Sublimt-Linter jshint를 설치한다. 간단히 jshint 로 검색해도 된다.

jshint 설치​

# 전역으로 jshint를 설치한다.
$ npm install -g jshint

설정 경로 변경​

Preferences > Package Settings > SublimeLinter > Settings - user 메뉴로 들어가, "users.linters.jshint.args"에 경로를 수정한다.

{
  "linters": {
    "jshint": {
      "@disable": false,
      "args": [
        // 여기에 경로를 적어준다.
        "--config=C:\\Users\\사용자\\npm\\node_modules\\jshint\\jshint_config.json"
      ],
      "excludes": []
    }
  }
}

VSCode​

내장되어있다. 파일 > 기본설정 > 설정에서 아래 속성을 만져주면 된다.

{
  "jshint.options": {}
}

설정 파일

소스​

{
  "esnext": true,
  "asi": false,
  "boss": false,
  "curly": true,
  "eqeqeq": true,
  "eqnull": false,
  "evil": false,
  "expr": true,
  "forin": true,
  "funcscope": false,
  "jquery": true,
  "latedef": true,
  "lastsemic": false,
  "loopfunc": false,
  "maxerr": 10,
  "nocomma": true,
  "nonbsp": true,
  "node": true,
  "nonew": false,
  "plusplus": false,
  "regexdash": false,
  "shadow": false,
  "strict": false,
  "supernew": false,
  "trailing": false,
  "undef": false,
  "unused": false,
  "white": false,
  "withstmt": false,
  "worker": true
}

설명​

• esnext : es6 의 구문을 사용할 수 있음
• asi : 세미콜론이 없을 수 있음
• boss : 비교문(lt, gt..)이 올 자리에 할당문(a = 1)이 올 수 있음
• curly : 중괄호 생략할 수 없음
• eqeqeq : ==를 사용할 수 없음 (===를 사용)
• eqnull : null 비교를 사용할 수 있음
• evil : eval 을 사용할 수 있음
• expr : 할당이나 함수호출이 아닌 표현식 사용할 수 있음 (예제 참조)
• forin : forin 반복문 사용시 if 으로 필터링을 해줘야함
• funcscope : 조건문 내의 선언된 변수를 조건문 바깥에서 참조 가능

function test() {
  if (true) {
    var x = 0;
  }

  x += 1; // Default: 'x' used out of scope.
  // No warning when funcscope:true
}

• jquery : jQuery 의 전역변수를 미리 정의
• latedef : 호출보다 늦게 정의된 변수를 금지 (호이스팅 방지)
• lastsemic : 한 줄짜리 블록 코드에서 마지막 세미콜론이 없을 경우만 오류
• loopfunc : 반복문 안에서 함수 정의 가능
• maxerr : 총 보여줄 오류의 갯수
• nocomma : comma 연산자 사용 금지
• nonbsp : non-breaking whitespace 금지
• node : 노드 환경 사용 가능
• nonew : new 생성자 사용 불가
• plusplus : 단항 증감연산자 사용 불가
• regexdash : 정규식에서 대괄호 안에 escape 처리 되지 않은 대쉬(-) 가능
• shadow : 변수 재선언 가능 (inner 또는 false, outer, true 로 설정)
• strict : "use-strict" 선언이 없을시 오류
• supernew : 잘못 작성한 생성자의 오류 표시 안함
• trailing : 라인 끝의 불필요한 공백이 있으면 오류
• undef : 선언되지 않은 변수 사용시 오류
• unused : 선언이 되었으나 사용되지 않는 변수에 대해 오류
• white : jshint 가 더글락스 크락포드의 코딩 스타일 가이드에 따라 코드를 검사
• withstmt : with 구문 사용 가능
• worker : Web Worker 사용 가능