NyaoVim

이것은 전자를 기반으로 한 Neovim 프론트 엔드입니다. Neovim 편집기는 웹 구성 요소로 구성되며 사용자는 재사용 가능한 웹 구성 요소, HTML, CSS 및 JavaScript로 UI를 확장 할 수 있습니다.

:help design-not :

VIM을 쉘에서 또는 IDE에서 구성 요소로 사용하십시오.

Nyaovim은 같은 정신으로 지어졌습니다. Nyaovim은 Neovim 편집기를 웹 구성 요소로 포함하고 다른 최신 편집기 및 IDE (예 : Atom, vs Code, Lighttable)에서와 같이 웹 기술로 UI를 확장합니다.

목표

• Nyaovim 번들 기본적으로 확장 UI가 없습니다. 멋진 UI 플러그인 아키텍처 만 제공합니다. 사용자는 웹 구성 요소, HTML 및 CSS로 좋아하는 UI를 구성 할 수 있습니다. 유용한 구성 요소가 번들로 제공되는 경우 Nyaovim 분포를 쉽게 만들 수 있습니다.
• 다른 플러그인 관리자를 소개하지 마십시오. 웹 구성 요소 용 HTML에는 VIM 플러그인이 번들로 번들되어야합니다. 따라서 VIM 플러그인 관리자는 UI 구성 요소를 처리하여 JS 및 VIM 스크립트 코드를 번들로 만들 수 있습니다.
• 기본적으로 Vim의 편안함을 잃지 마십시오. 성능을 알고 있어야합니다.
• UI 구성 요소 제작자는 강력한 API, 패키지 및 도구를 사용할 수 있습니다 . Node.js API, Electron API, Neovim Msgpack-RPC API), 많은 NPM 패키지 및 Chrome DevTools.
• 크로스 플랫폼 (Linux, OS X, Windows)

메모 : 'Nyao'는 일본어로 'Meow'이며 발음은 'Neo'와 비슷합니다. 또한 '아직 또 다른 원본'의 약어입니다.

앱 구조

Nyaovim은 다음 그림과 같이 전자의 웹 구성 요소로 구성됩니다. 처음에는 <neovim-editor> 만 있으며 추가 구성 요소를 추가/제거 할 수 있습니다.

UI 플러그인 예제

UI 플러그인은 일반 플러그인만큼 쉽게 설치할 수 있습니다. 그들 각각은 100 ~ 300 줄 이내에 쓰여집니다. 재사용 가능한 웹 구성 요소를 만들어 Nyaovim에 통합 할 수도 있습니다.

• Nyaovim-Markdown-Preview

• Nyaovim-popup-tooltip

• Nyaovim-Mini-Browser

용법

시작하기

Nyaovim을 NPM 패키지로 설치할 수 있습니다. 현재 포장 릴리스는 아직 없습니다. Windows를 사용하고 Neovim을 아직 설치하지 않은 경우 먼저 팁을 읽으십시오.

$ npm install -g nyaovim

시스템 패키지 관리자를 통해 node Pacakge를 설치 한 경우 npm sudo 필요할 수 있습니다.

Nyaovim이 내부적으로 nvim 명령을 사용하기 때문에 NEOVIM을 아직 설치하지 않은 경우 NEOVIM의 지침에 따라 설치하십시오. nvim V0.1.6 이상이 필요합니다.

이 앱을 NPM으로 설치하면 nyaovim 명령으로 Nyaovim을 시작할 수 있습니다.

$ nyaovim [files...]

GVIM과 같은 최소 Neovim GUI 편집기가 표시됩니다. 이것은 전자 앱이며 Neovim은 <canvas> 에 그려집니다. '개발자 도구'메뉴 항목 으로이 앱의 DevTools를 볼 수 있습니다.

Nyaovim을 처음 시작하면 UI 구성을 위해 ~/.config/nyaovim/nyaovimrc.html 만듭니다 (Windows에서 .config 대신 %AppData% ). 예, HTML 및 CSS로 UI 구성 요소를 확장하고 구성 할 수 있습니다!

편집기 옵션을 구성합니다

나는 당신이 지금 '흠, 글꼴이 좋지 않고 너무 작지 않습니다 ...'라고 생각하는 것 같아요. <neovim-editor> 속성의 속성으로 일부 편집기 옵션을 구성 할 수 있습니다. 예를 들어, 아래는 font 및 글꼴 font-size 크기를 구성합니다. 그런 다음 라인 높이를 1.5로 설정합니다 (예 : Atom은 1.5를 라인 높이로 채택 함).

 < neovim-editor
    id =" nyaovim-editor "
    argv =" [[argv]] "
    font-size =" 14 "
    font =" Ricty,monospace "
    line-height =" 1.5 "
> </ neovim-editor >

또한 browser-config.json (예 : 보존 창 상태, 단일 인스턴스 앱 등)으로 브라우저 창 옵션을 구성 할 수도 있습니다. 자세한 내용은 팁을 참조하십시오.

UI 플러그인을 설치하십시오

예를 들어 Nyaovim-Popup-Tooltip을 설치하겠습니다.

목표 섹션에 설명 된 바와 같이 UI 플러그인은 일반적인 Neovim 플러그인입니다. 다른 neovim 플러그인처럼 설치할 수 있습니다. vim-plug를 사용하는 경우 init.vim 에 아래 줄을 추가하면됩니다.

Plug ' rhysd/nyaovim-popup-tooltip '

그런 다음 팝업 툴팁 UI를 Nyaovim 인터페이스에 넣어야합니다. ~/.config/nyaovim/nyaovimrc.html (Windows에서 .config 대신 %AppData% )을 열어주세요. 목표 섹션에 설명 된 바와 같이, 사용자는 HTML과 CSS가 높은 사용자 정의로 UI를 구축 할 수 있습니다.

아래와 같이 <neovim-editor> 태그 아래에서 <popup-tooltip> 태그를 추가하십시오

 < neovim-editor id =" nyaovim-editor " argv =" [[argv]] " > </ neovim-editor >
< popup-tooltip editor =" [[editor]] " > </ popup-tooltip >

<popup-tooltip> 은 중합체 성분입니다. editor="[[editor]]" 는 폴리머 프레임 워크에서 편집기 인스턴스를 <popup-tooltip> 으로 전달하는 데이터 바인딩입니다. 그것은 부모에서 자식으로 단방향 데이터 흐름을 의미합니다.

Nyaovim-Popup-Tooltip을 Neovim 플러그인으로 설치하고 HTML에 UI를 추가 한 후에는 모두 완료되었습니다! Nyaovim을 열고 커서를 이미지 경로로 옮기고 gi 를 입력하십시오. Nyaovim은 이미지를로드하여 아래와 같이 팝업 툴팁에 표시합니다.

서류

문서 디렉토리에는 더 많은 문서가 있습니다.

• UI 플러그인을 만드는 방법
• 팁
• FAQ
• 런타임 API
• 브라우저 구성

버전 작성

Nyaovim은 현재 베타 단계에 있습니다. 메이저 버전은 안정적인 릴리스가 될 때까지 0으로 고정됩니다.

마이너 버전을 업데이트하면 변경 사항이 포함되어 있음을 의미합니다. 패치 버전을 업데이트하면 변경 사항이 포함되지 않으므로 버전을 쉽게 업데이트 할 수 있습니다.

특허

MIT 라이센스.

이 앱의 로고는 CCA 3.0 Unported에 따라 라이센스가 부여 된 Neovim 로고를 기반으로 작성됩니다.

Jason Long의 Neovim 로고는 Creative Commons Attribution 3.0 Unported License에 따라 라이센스가 부여됩니다.