웹마스터 팁

[Source] : https://github.com/prettier/plugin-php

 

일단 Prettier가 뭔지 먼저 설명드리면,

내가 작성한 코드를, 흔히 쓰이는 포맷 또는 미리 설정한 일정한 기준에 따라 자동으로 변환시켜주는 포매터입니다.

에디터의 확장도구를 통한다면 저장 (ctrl + s) 할 때마다 적용시킬 수 있습니다.

자바스크립트에서는 거의 필수적으로 쓰는 툴인데, PHP는 플러그인으로 따로 추가되었었네요. 

 

제가 사용하는 에디터가 VSCODE 기 때문에 VSCODE 기준으로 적용 방법 알려드릴게요.

(위에 링크로 들어가보시면 ATOM이나 SUBLIME같은 에디터에 적용하는 방법도 안내되어 있습니다.)

 

1. 확장도구 prettier를 설치합니다.

 

2. 추가 플러그인을 설치해야합니다.

VSCODE에서는 플러그인을 공식지원하지 않기 때문에, 수동으로 설치해야됩니다.

사전에 nodejs 와 npm 이 깔려있어야 합니다. (개발자분들에게 전하는 팁이므로 자세한 설명은 생략합니다)

터미널을 여셔서

cd ~/.vscode-insiders/extensions/esbenp.prettier-vscode-1.9.0/

치신 후, (안되시면 vscode-insiders 를 vscode 로 바꿔보세요)

npm install @prettier/plugin-php

 를 치면 자동으로 설치가 됩니다. vscode 는 재시작해주세요 (ctrl + alt + r)

 

3. vscode 설정에 다음을 추가합니다. (vscode 내에서 ctrl + , )

{
  "[php]": {
    "editor.formatOnSave": true
  },
  "prettier.printWidth": 100, // 한 행 당 최대 글자 수
  "prettier.singleQuote": true, // 작은 따옴표 ('') 사용 여부, false 시 큰 따옴표 ("")
  "prettier.useTabs": false, // 여백을 tab으로 쓸지 여부, false 시 space 사용
  "prettier.tabWidth": 4, // 여백 칸수 (스페이스 n번만큼의 크기)
  
}

 

4. 작업하던 파일에서 저장해봅시다. (ctrl + s)

제목 글쓴이 날짜
제로보드 XE - 오토셋에 설치하기 [11] file 차오이 2007.08.11
윈도우에서도 svn을 이용하자.. [2] LSH5243 2007.08.13
SVN 자료 바로바로 업데이트 해보자. [3] DroArc 2007.08.13
서버에서 zeroboard XE 쉽게 다운로드 받고 업데이트 하기 [2] Dr.Mabin 2007.08.13
Mysql 4.0 버전에서 xe 설치해서 사용하기 [3] amamamam.myid.net 2007.08.13
좌측 메뉴 하단에 애드센스를 탑재해 보자! [5] migojarad.myid.net 2007.08.13
로그인 안되시는분들 참고 [8] 화니478 2007.08.14
로고 만들기 귀찮을떄 [2] 정지훈308 2007.08.14
포트 변경 후 XE 사용이 안 되면 류현留賢 2007.08.14
상단 로고부분 공간 늘릴려면... [3] 똑디 2007.08.14
설치 후 로그인 불가능 문제 해결방법 [14] 엘핀라즈 2007.08.14
최신글 뽑아오기 - 간단한 방법 [3] file Eric2ya 2007.08.14
최근글 및 카운터 로그인등등.. 모르시는분있을꺼라고 생각해서올려요 [7] file 장재혁512 2007.08.15
공백으로 보이는 문제 해결 방법 (프레임, 메타태그, 포워딩등) [21] ZK™ 2007.08.15
zbXE게시판 상단 내용처럼 꾸미기... [12] 이승수961 2007.08.15
외부에서 회원정보 불러오기 [5] 미오유 2007.08.15
공개 소스 웹 디자인 [6] 나라비 2007.08.15
음악플레이어를 달고싶으세요? [13] 부찬™ 2007.08.16
사이트 주소로 접속했을때 XE 폴더로 이동하기 팁 [42] 베니 2007.08.16
4차 서브메뉴 사용하기!! [4] [1] file 럭키587 2007.08.17