프프프

1. 포터블 경로 추가 (Sublime Text 3)

SublimeLinter.sublime-setting.json (SublimeLinter setting)

"paths": {

    "linux": [],

    "osx": [],

    "windows": [

        "/NodeJSPortable/Data",  //현재 npm package 가 설치되어 있는 경로

        "/NodeJSPortable/App/NodeJS"  //현재 NodeJS.exe 가 존재하는 경로

    ]

}

2. 사용자 변수 추가 (윈도우)

시스템 >고급 시스템 설정 > 환경변수

Path

C:\NodeJSPortable\App\NodeJS //현재 NodeJS.exe 가 존재하는 경로

SublimeLinter setting 에서 복수 경로 입력이 가능 하니 사용자 변수를 추가적으로 설정해줄 필요는 없다.

html 파일에서는 tab으로 emmet 기능이 확장이 잘 되었는데 jsp나 php 같은 곳에서는 tab키로 확장이 되지 않았다.

jsp나 php 파일에서도 쓸 수 있도록 옵션을 추가해주어야 한다.

1. setting -> keybindings 에서 your keymap file 클릭

2. keymap.cson 에 내용 추가

#해당 내용

/*

On OS X, basic text manipulations (left, right, command+left, etc) make use of the system key bindings,

and don't need to be repeated here. Anything listed here will take precedence, however.

*/

{ "keys": ["super+alt+s"], "command": "save_all" }, // 모든 파일 저장

{ "keys": ["super+k", "super+b"], "command": "toggle_side_bar" }, // 사이드바 열기 **

{ "keys": ["super+ctrl+f"], "command": "toggle_full_screen" }, // 전체화면

{ "keys": ["super+option+v"], "command": "paste_from_history" }, // 복사 히스토리 열기 *

{ "keys": ["ctrl+alt+up"], "command": "scroll_lines", "args": {"amount": 1.0} }, // 화면 한줄씩 위로 이동

{ "keys": ["ctrl+alt+down"], "command": "scroll_lines", "args": {"amount": -1.0} }, // 화면 한줄씩 아래로 이동

{ "keys": ["ctrl+shift+up"], "command": "select_lines", "args": {"forward": false} }, // 다중 선택 *****

{ "keys": ["ctrl+shift+down"], "command": "select_lines", "args": {"forward": true} }, // 다중 선택 *****

{ "keys": ["super+shift+["], "command": "prev_view" }, // 탭 이동 ***

{ "keys": ["super+shift+]"], "command": "next_view" }, // 탭 이동 ***

{ "keys": ["super+alt+left"], "command": "prev_view" }, // 탭 이동 ***

{ "keys": ["super+alt+right"], "command": "next_view" }, // 탭 이동 ***

{ "keys": ["super+]"], "command": "indent" }, // 들여 쓰기

{ "keys": ["super+["], "command": "unindent" }, // 내어 쓰기

{ "keys": ["super+l"], "command": "expand_selection", "args": {"to": "line"} }, // 한줄단위로 선택

{ "keys": ["super+d"], "command": "find_under_expand" }, // 동일 단어 다중 선택 *****

{ "keys": ["super+k", "super+d"], "command": "find_under_expand_skip" }, // 동일 단어 다중 선택 제외 **

{ "keys": ["super+shift+space"], "command": "expand_selection", "args": {"to": "scope"} },

{ "keys": ["ctrl+shift+m"], "command": "expand_selection", "args": {"to": "brackets"} },

{ "keys": ["ctrl+m"], "command": "move_to", "args": {"to": "brackets"} },

{ "keys": ["super+shift+j"], "command": "expand_selection", "args": {"to": "indentation"} },

{ "keys": ["super+shift+a"], "command": "expand_selection", "args": {"to": "tag"} },

{ "keys": ["super+alt+."], "command": "close_tag" }, // 태그 닫기

{ "keys": ["ctrl+minus"], "command": "jump_back" }, // 이전 작업 부분으로 이동 (전체 파일)

{ "keys": ["ctrl+shift+minus"], "command": "jump_forward" }, // 최근 작업 부분으로 이동 (전체 파일)

{ "keys": ["super+i"], "command": "show_panel", "args": {"panel": "incremental_find", "reverse": false} }, // 다음 단어 찾기

{ "keys": ["super+shift+i"], "command": "show_panel", "args": {"panel": "incremental_find", "reverse": true} }, // 이전 단어 찾기

{ "keys": ["alt+super+g"], "command": "find_under" }, // 다음 선택 단어로 이동

{ "keys": ["shift+alt+super+g"], "command": "find_under_prev" }, // 이전 선택 단어로 이동

{ "keys": ["ctrl+super+g"], "command": "find_all_under" }, // 단어 전체 선택

{ "keys": ["super+shift+f"], "command": "show_panel", "args": {"panel": "find_in_files"} }, // 전체 파일 찾기 *****

{ "keys": ["f4"], "command": "next_result" }, // 전체 파일 찾기의 다음 부분으로 이동 (전체 파일)

{ "keys": ["shift+f4"], "command": "prev_result" }, // 전체 파일 찾기의 이전 부분으로 이동 (전체 파일)

{ "keys": ["ctrl+super+up"], "command": "swap_line_up" }, // 커서 라인 상단으로 이동 *

{ "keys": ["ctrl+super+down"], "command": "swap_line_down" }, // 커서 라인 하단으로 이동 *

{ "keys": ["super+forward_slash"], "command": "toggle_comment", "args": { "block": false } },

{ "keys": ["super+alt+forward_slash"], "command": "toggle_comment", "args": { "block": true } },

{ "keys": ["super+j"], "command": "join_lines" }, // 라인 합치기

{ "keys": ["super+shift+d"], "command": "duplicate_line" }, // 라인 복사 **

{ "keys": ["super+alt+p"], "command": "show_scope_name" },

{ "keys": ["super+k", "super+up"], "command": "new_pane" }, // 새로운 구분 창 추가하면서 해당 창으로 이동

{ "keys": ["super+k", "super+u"], "command": "upper_case" }, // 대문자로

{ "keys": ["super+k", "super+l"], "command": "lower_case" }, // 소문자로

{ "keys": ["super+alt+["], "command": "fold" }, // 해당 블록 접기

{ "keys": ["super+alt+]"], "command": "unfold" }, // 해당 블록 펴기

{ "keys": ["super+k", "super+1"], "command": "fold_by_level", "args": {"level": 1} }, // 접기 레벨1

{ "keys": ["super+k", "super+2"], "command": "fold_by_level", "args": {"level": 2} }, // 접기 레벨2 

{ "keys": ["super+k", "super+3"], "command": "fold_by_level", "args": {"level": 3} }, // 접기 레벨3

{ "keys": ["super+k", "super+4"], "command": "fold_by_level", "args": {"level": 4} }, // 접기 레벨4

{ "keys": ["super+k", "super+5"], "command": "fold_by_level", "args": {"level": 5} }, // 접기 레벨5

{ "keys": ["super+k", "super+6"], "command": "fold_by_level", "args": {"level": 6} }, // 접기 레벨6

{ "keys": ["super+k", "super+7"], "command": "fold_by_level", "args": {"level": 7} }, // 접기 레벨7

{ "keys": ["super+k", "super+8"], "command": "fold_by_level", "args": {"level": 8} }, // 접기 레벨8

{ "keys": ["super+k", "super+9"], "command": "fold_by_level", "args": {"level": 9} }, // 접기 레벨9

{ "keys": ["super+k", "super+0"], "command": "unfold_all" }, // 모두 펴기

{ "keys": ["super+k", "super+j"], "command": "unfold_all" }, // 모두 펴기

{ "keys": ["super+k", "super+t"], "command": "fold_tag_attributes" },

{ "keys": ["super+alt+o"], "command": "toggle_overwrite" }, // 커서 삽입, 수정 전환

SublimeText 3 는 기본으로 utf-8 인코딩을 사용한다.
만약 euc-kr 로 작성된 코드를 읽고 싶다는 ConvertToUTF8 패키지를 설치하자.

Ctrl + Shift + P -> install package -> ConvertToUTF8 설치

sublimetext 3 재시작하면 file 메뉴에 아래 항목이 생긴다.
Set File Encdoing To (인코딩을 변경해서 파일 저장)
Reload With Encoding (선택한 인코딩으로 다시 파일 로드)

사실 이제부터 euc-kr 파일을 읽으면 Reload with Encoding 사용하지 않고도 알아서 인코딩이 선택된다.
ConvertToUTF8.sublime-settings(Preferences -> Package Settings -> ConvertToUTF8 -> Settgins - Default) 설정에 다음과 같이 기본 설정되어 있다.
// Convert when loading/saving a file
"convert_on_load" : true,
"convert_on_save" : true


ConvertToUTF8 디폴트 메뉴는 다음과 같다.
Chinese Simplified(GBK) 중국어 간체
Chinese Traditional(BIG5) 중국어 번체
Korean (EUC-KR) CP949 도
Japanese (CP932)
Japanese (Shift_JIS)
Japanese (EUC-JP)

메뉴에는 없지만 CP949 도 지원한다.

<설치 순서>

1. node.js 설치

2. sublimelinter 플러그인 설치

3. sublimelinter 추가 플러그인 설치

(sublimelinter-csslint

sublimelinter-jshint

sublimelinter-contrib-htmlhint 등)

4. 플러그인이 설치되는 해당 폴더에 권한부여 (OS X 만 해당)

//OS X 의 경우

권한이 필요 한 것으로 보인다

파일이 깔리는 곳의 폴더 권한

sudo chown -R 사용자이름 /usr/local/lib/node_modules

파일 링크가 걸리는 곳의 폴더 권한

sudo chown -R 사용자이름 /usr/local/bin

(OS X 경로는 대부분 비슷한거 같다. 경로를 모르겠으면 아래 터미널 명령어 npm intall -g 플러그인이름 을 쳐보면 경로가 나오면서 권한이 없다고 뜰 것이다. 나와있는 경로 맞춰서 권한 부여해주면 끝)

5. 터미널을 열어서 명령어로 플러그인 수동 설치

터미널 명령어

npm install -g 플러그인이름

예)

npm install -g jshint

npm install -g csslint

npm install -g htmlhint

jshint --version //인스톨 확인

(package control 을 통해서 깔면 별도의 터미널 명령어가 필요없다고 나와있는 것 같은데 직접 해본 결과 window, os x 두 os 모두 실행되지 않는 것을 발견하였다. 물론 나만 해당되는 문제일 수도 있다.

결과적으로 package control을 통해 설치파일을 깔아주고 터미널을 통해 명령어를 입력하여서 다시 깔아주었더니 작동하는것이 확인되었다.

html-tidy lint 는 그냥 안되는건지 안되더라.)

경로가 맞지 않는다고 뜬다면 경로 설정도 필요하다. (경로의 경우 다를 수 있음)

"paths": {

            "linux": [],

            "osx": [

                "/usr/local/lib/node_modules"

            ],

            "windows": []

}

6. sublime text 재시동

-끝-

-----------------------------------

csslint 오류 옵션설정 (무시하고 싶은 경고 들)

"csslint": {

    "@disable": false,

    "args": [],

    "errors": "",

    "excludes": [],

    "ignore": [

        "important",

        "adjoining-classes",

        "import",

        "ids",

        "box-model",

        "box-sizing",

        "qualified-headings",

        "unique-headings",

        "floats",

        "font-sizes",

        "duplicate-background-images",

        "order-alphabetical",

        "fallback-colors",

        "overqualified-elements"

    ],

    "warnings": ""

},

-ignore 옵션 설명-

"important",   // Disallow !important

"adjoining-classes",   // Disallow adjoining classes

"import",   // Disallow @import

"ids",   // Disallow IDs in selectors

"box-model",   // Beware of box model size

"box-sizing",   // Disallow box-sizing

"qualified-headings",   // Disallow qualified headings

"unique-headings",   // Headings should only be defined once

"floats",   // Disallow too many floats

"font-sizes",   // Don't use too many font-size declarations

"duplicate-background-images",   // Disallow duplicate background images

"fallback-colors",   // Require fallback colors

"overqualified-elements",   // Disallow overqualified elements

"order-alphabetical"

---------- 2016-10-19 추가

//node_moduels 설치되는 경로 (windows)

C:\Users\Administrator\AppData\Roaming\npm

//설정된 lint rule을 추가하거나 변경하려면 이곳에서 수정

ex) csslint 경우

C:\Users\Administrator\AppData\Roaming\npm\node_modules\csslint\node_modules\parserlib\lib\node-parserlib.js