visual react editor

하이브

소개

비록 Figma 또는 유사한 디자인 도구 내에서 작동하는 것과 유사하게 React Applications를 시각적으로 편집 할 수있는 새로운 웹 개발 방식을 안내합니다. 당사의 도구를 사용하면 디자이너와 개발자가 시각적 편집기에서 애플리케이션의 UI 요소를 직접 조작하여 디자인 소프트웨어의 편의성을 강력한 React의 프레임 워크와 병합 할 수 있습니다.

특징

• React 앱 내에서 Figma와 같은 환경에서의 시각적 편집.
• 라이브 코드 업데이트를위한 프록시 서버를 제공하는 CLI 도구.
• 안전을 보장하기 위해 개발 환경에서 사용하도록 설계되었습니다.

설치

UnderHive를 설치하려면 프로젝트 디렉토리에서 다음 명령을 실행하십시오.

npm install underhive

설정

기본 React 파일에서 과소점을 가져옵니다.

 import { attachEditor , detachEditor } from 'underhive' ;

attachEditor 사용하여 시각적 편집 환경을 활성화하십시오.

 if ( process . env . NODE_ENV === 'development' ) {
  attachEditor ( ) ;
}

detachEditor 호출하여 비주얼 편집기를 비활성화하십시오.

 detachEditor ( ) ;

이러한 기능이 개발 환경 검사 내에서 사용되는지 확인하십시오.

용법

프로젝트에서 초기화 :

npx ucli init

이렇게하면 package.json concurrently 사용하여 Underhive 서버 명령을 포함하도록 Package.json을 수정하고 수정합니다. 이를 통해 기존 시작 스크립트와 UnderHive 서버가 동시에 실행되도록합니다.

Underhive로 프로젝트를 시작하려면 다음을 사용하십시오.

npm start

공물

이 프로젝트는 ProjectvisBug 제작자의 원래 노력 없이는 불가능합니다.

스타 역사