widget builder

위젯 빌더

간단한 CLI로 Windows 데스크탑 용 HTML 위젯을 개발, 설치 및 배포하십시오.

목차

1. 설치
2. QuickStart 가이드
3. 샘플
4. 게시 및 설치
   1. 출판
   2. 설치
5. 구성 파일
6. CLI 사용
7. 기여 위젯

설치

다운로드, unzip, 폴더로 이동하고 npm 으로 설치하십시오.

 $ npm install -g
$ npm start

또는 npm 에서 직접 다운로드 :

 $ npm install -g widget-builder

QuickStart 가이드

1. 새 폴더를 만듭니다
2. cd 폴더에 CD, widgets init 입력하고 프로젝트 이름을 작성하십시오.
3. 생성 된 HTML 파일을 사용하여 위젯의 모양을 사용자 정의하십시오.
4. JavaScript 또는 CSS 파일을 추가 및 링크 마스터 html 파일에 연결합니다.
5. 구성 파일을 수정하십시오
6. 폴더로 이동하여 widgets build 입력하여 로컬 빌드 및 위젯을 설치하십시오.

샘플

좋아하는 음악을들을 수있는 위젯 인 Spotify Listener를 확인하십시오.

위젯 게시 및 설치

출판

그래서 배포를 위해 위젯을 공유하고 싶습니까? 해야 할 일은 다음과 같습니다.

1. 프로젝트 폴더에 cd
2. widgets publish 실행합니다
3. 프로젝트 폴더와 동일한 디렉토리에서 새로운 dist 폴더가 생성됩니다. 이제이 폴더를 배포 할 수 있으며 다른 폴더는 widgets install 로 설치할 수 있습니다.

설치

다음은 귀하와 공유 된 위젯을 설치하는 방법입니다.

1. 폴더로 이동하십시오
2. widgets install 실행합니다

구성 파일

모든 위젯 프로젝트에는 config.json 파일이 포함되어 있습니다. 이 파일은 프로그램에 위젯에 어떤 설정을 사용하고 싶은지 알려줍니다.
다음은 표준 구성 파일입니다.

{
  "name" : " widget " ,
  "version" : " 1.0.0 " ,
  "description" : " Custom desktop widget " ,
  "index" : " ./index.html " ,
  "properties" : {
    "x" : 100 ,
    "y" : 100 ,
    "width" : 100 ,
    "height" : 100 ,
    "transparent" : false ,
    "interact" : true ,
    "draggable" : true
  }
}

재산	정의
name (문자열)	프로젝트 이름
version (문자열)	프로젝트 버전
index (문자열)	마스터 html 파일에 대한 참조. 다른 참조 (JS 또는 CSS와 같은)는이 파일에 연결되어야합니다.
x , y , width 및 height (정수)	위젯이 처음 시작할 때 위젯의 위치와 치수
transparent (부울)	위젯의 배경을 투명하게 만듭니다
interact (부울)	위젯을 상호 작용할 수 있도록하십시오
draggable (부울)	위젯을 드래그하기 쉽게 만듭니다
top (부울)	위젯을 모든 창 위에 머물게하십시오
requirements (배열)	위젯이 작동하는 데 필요한 NPM 패키지; 이 패키지는 위젯이 설치 될 때 로컬로 설치됩니다.
install (문자열 또는 배열)	위젯 설치 중에 실행할 스크립트

CLI 사용

위젯 빌더가 설치되면 키워드 widgets 으로 CLI에 액세스 할 수 있습니다.

명령

명령	정의
widgets build [folder]	HTML 파일을 데스크탑 위젯 및 설치로 빌드합니다
widgets publish [folder]	위젯 CLI에서 설치할 수있는 Dist 파일을 생성합니다.
widgets install [folder]	폴더에 위젯을 설치합니다
widgets init [folder]	위젯 프로젝트를 초기화합니다
widgets list	설치된 모든 위젯을 나열합니다
widgets uninstall <widget>	이름으로 위젯을 제거하십시오
widgets config <widget>	이름 별 위젯을 구성하십시오
widgets start [folder]	폴더에서 위젯을 시작합니다

옵션

명령	정의
widgets --help	도움을 보여주세요
widgets --version	현재 버전을 표시합니다

기여 위젯

여기에서 만든 위젯 공유에 대한 지침을 찾을 수 있습니다.