!를 입력하고 Tab을 누르면 기본 틀이 나오는데 작성일(16.2.21)일 기준
2.4.1버전의 emmet는
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
아래의 코드가 작성된다.
이 상태에서는 한글 입력이 안된다.
이 때 한글 입력을 하려면 세팅값을 바꿔줘야한다.
아래의 과정을 따라간다.
atom 실행 -> File -> Open Folder
emmet가 설치된 경로인 C드라이브로 이동 -> Users폴더 -> Administrator(관리자 폴더) -> .atom폴더 -> packages폴더 -> emmet 폴더 -> 폴더 경로 복사
그럼 위의 상태가 된다.
이 상태에서 [Ctrl] + [Shift] + [F] 키를 눌러서 전체검색을 한다
검색 키워드는 html:5 을 검색한다
처음에 보이는 코드가 아닌 두번째에 보이는 코드 [835 "html:5": "!!!~~~~]을 더블클릭한다
"html:5": "!!!+doc[lang=${lang}]",
이런 코드가 있는데 이 코드는
"abbreviations": {
"!": "html:5",
"a": "<a href=\"\">",
"a:link": "<a href=\"http://|\">",
"a:mail": "<a href=\"mailto:|\">",
강조 표시된 부분에서 보듯 !을 입력하면 html:5를 호출한다.
html:5는 "html:5": "!!!+doc[lang=${lang}]",을 호출하게 되고 여기서 lang은 snippets.json(현재 보고있는 소스코드)의 가장 윗부분을 보면
이런 옵션이 있는데 "lang": "en", 이 부분의 값을 읽어 오는 것이다.
나는 영어 뿐만 아니라 한국어도 입력할 것이므로 "lang": "en, kr", 으로 설정값을 추가해주었다.
