Atom에 일반적으로 사용되는 권장 플러그인(vue 구문 강조)

관련 추천: atom(동영상 튜토리얼)

Atom을 사용한 것도 우연이었습니다. 저는 이전에 sublime을 사용해 본 적이 있고, 회사로 전환한 후에는 몇 가지 빠른 사용법에 익숙해졌습니다. , 회사가 변경되었습니다. Atom을 사용하는 경우 Romans처럼 하고 대신 Atom을 플레이해 보세요.

Atom은 여전히 ​​Sublime과 매우 유사하다는 것을 알았습니다. 많은 패키지가 매우 완벽합니다.

이제 일반적으로 사용되는 몇 가지 플러그인을 알려드리겠습니다.

(플러그인을 설치하고 구성을 완료했지만 원하는 효과를 얻지 못한 경우 종료했다가 다시 열어보세요. )

팁: 때때로 설치가 실패할 경우 다른 방법을 시도해 보세요.

1. C:/Users/사용자 이름/.atom/packages/ 폴더를 찾으세요.

2.atom 패키지 디렉터리에서 gitbash를 사용하세요.

3.git clone xxxxx/atom-beautify.git(github의 플러그인 주소)

3.cd .atom-beautify(다운로드한 플러그인의 디렉터리 입력)

4.npm install

5. 완료(Atom을 다시 시작하는 것을 잊지 마세요)

플러그인을 소개하기 전에 플러그인 설치 위치에 대해 이야기해 보겠습니다. 패키지 > 설정 보기 > 패키지/테마 설치

1.Sync 설정

을 github과 동기화하여 Atom 플러그인 정보 및 구성 정보를 사용하면 한 대의 컴퓨터를 쉽게 구성하고 여러 컴퓨터와 공유할 수 있습니다.

2. Emmet

은 Emmet 구문을 기반으로 HTML을 생성할 수 있는 플러그인입니다. 너무 유익해서 눈물이 납니다.

3. Atom Beautify

코드 서식 도구는 얼마나 편리한지는 말할 것도 없고 저장할 때 자동으로 서식을 지정하도록 설정할 수 있습니다. html, css, javascript, java, go 등을 지원합니다. 기본적으로 모든 공용 언어가 지원됩니다.

구성:

구성하려는 언어를 선택하세요. 저는 vue를 선택했습니다

4.Autocomplete Paths

파일 경로를 자동으로 완성합니다. 이 기능을 사용해야 하며, 경로 입력 오류로 인한 버그를 완전히 방지해야 합니다. .

5.HTML 자동 닫기

해당 HTML 닫기 태그를 자동으로 입력해 주는 간단하면서도 실용적인 방법입니다.

6.Minimap

이 플러그인은 소개가 필요 없이 sublime을 시작할 때부터 사용해 왔습니다. 절대 잊지 마세요.

7.color-picker

색상 선택기를 사용하면 코드 작성 중에 색상 선택기를 직접 열고 색상을 선택할 수 있습니다.

8.vim-mode

vim을 좋아하는 팬을 위한 필수 플러그인입니다.

9.git-plus

를 사용하면 다양한 일반 Git 기능을 손쉽게 사용하여 편집기에서 Git 프로젝트를 쉽게 관리할 수 있습니다.

10.file-icons

뷰티 컨트롤 개발자에게 꼭 필요한 다양한 유형의 파일에 아름다운 작은 아이콘을 추가하는 것은 매우 간단합니다.

11.docblockr

문서 주석, 아시다시피 팀 협업 표준 주석에 필요한 플러그인입니다.

12.Linter Jshint

js 개발자에게 꼭 필요한 플러그인인 전문적인 js 코드를 작성하는 데 도움이 됩니다.

개인 필요에 따라 이것들과 다른 것들을 설치하는 것이 좋습니다.

다 설치됐고, 리액트 개발도 되고, 코드 하이라이팅도 전혀 문제 없고, 증명할 사진도 있어요

하지만 vue는 한번 해보세요. 색의 흔적도 없이 전부 회색이에요. 눈물이 나서 길을 찾으려고 노력 중입니다. 해결됨,

설치

설치가 완료되었습니다. 완벽합니다. 코드를 다시 살펴보니 또 눈물이 났습니다. 레이블만 강조 표시되고 구문은 여전히 ​​회색입니다

이건 내가 원하는 게 아니고 내가 원하는 거야 구문도 강조해야 해.

vue 구문 강조 구현을 계속하세요

1.

파일》User Keymap》keymap.cson 파일을 선택하세요(파일》KeyMap... > keymap.cson)

2. file : 'atom-text-editor[data-grammar~="vue"]:not([mini])':의 다른 구성이 이미 있는 경우 이를 추가해야 합니다. 다른 구성에 'atom-text-editor[data-grammar~="vue"]:not([mini])':的其他配置, 那么要在其他配置的下面直接添加'tab': 'emmet:expand-abbreviation-with-tab''tab': 'emmet:expand-abbreviation-with-tab'을 직접 추가하지만 다음 두 줄을 직접 추가할 수는 없습니다. 그렇지 않으면 오류가 보고됩니다)

'atom-text-editor[data-grammar~="vue"]:not([mini])':

'tab': 'emmet:expand-abbreviation-with-tab'

그림과 같이 :

Atom을 다시 종료하고 다시 시작하세요. 우리가 원하는 효과는 기본적으로 sublime과 동일합니다.

마지막으로 영어를 잘 못하고 중국어 버전을 원하는 학생들은 그냥 사용하세요.

마지막으로 여담으로 Atom을 포기하고 vsCode를 첫 번째 선택으로 나열할 수 있습니다.

더 많은 프로그래밍 관련 지식을 보려면 프로그래밍 비디오를 방문하세요! !

위 내용은 Atom에 일반적으로 사용되는 권장 플러그인(vue 구문 강조)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!