스트림 데크 SDK에 오신 것을 환영합니다 - 스트림 데크를위한 플러그인을 만들도록 설계된 스트림 데크 SDK는 스트림 데크 앱과 연결하고 통신하는 데 필요한 모든 것을 제공하여 재미있는 물건에 집중할 수 있습니다.
node.js로 스트림 데크 플러그인을 작성하려면 node.js v20이 필요합니다. Node.js를 설치할 때 NVM (MACOS) 또는 NVM-Windows (Windows)와 같은 버전 관리자를 사용하는 것이 좋습니다.
스트림 데크 CLI는 플러그인 생성, 테스트 및 번들링을위한 명령을 제공하며 스트림 데크를위한 가장 쉬운 방법입니다. 문서에서 시작하는 것에 대해 자세히 알아볼 수도 있습니다.
npm install -g @elgato/cli@latest
create
명령을 실행하여 Creation Wizard를 초기화하십시오. streamdeck create
streamdeck create
로 플러그인을 만든 후에는 플러그인을 구축하기위한 로컬 환경이 제공됩니다.
/
├── *.sdPlugin/
│ ├── bin/
│ ├── imgs/
│ ├── logs/
│ ├── ui/
│ │ └── increment-counter.html
│ └── manifest.json
├── src/
│ ├── actions/
│ │ └── increment-counter.ts
│ └── plugin.ts
├── package.json
├── rollup.config.mjs
└── tsconfig.json
package.json
은 플러그인을 만들기위한 두 개의 스크립트를 제공합니다.
npm run build
- 플러그인을 빌드합니다.npm run watch
변경 사항을 지속적으로 시청하고 빌드 후 플러그인을 핫 릴로드합니다. 액션은 쇼의 스타이며 사용자가 플러그인과 상호 작용할 수 있습니다. 동작은 SingletonAction
에서 상속되는 클래스로 표시되므로 플러그인이 스트림 데크 (예 : 키 다운, 다이얼 회전 등)에서 이벤트를 수신 할 수 있습니다.
다음은 keyDown
이벤트를 듣고 소스 작업의 제목을 설정하는 작업의 예입니다.
import { action , KeyDownEvent , SingletonAction } from "@elgato/streamdeck" ;
@ action ( { UUID : "com.elgato.hello-world.say-hello" } )
export class SayHelloAction extends SingletonAction {
/**
* Listen for the key down event that occurs when a user presses
* a Stream Deck button, and change the title of the action.
*/
async onKeyDown ( ev : KeyDownEvent ) {
await ev . action . setTitle ( "Hello world" ) ;
}
}
Node.js 디버거 (예 : Visual Studio Code, Chrome 등)를 사용하여 플러그인을 디버깅 할 수 있으며 기본적으로 스트림 데크 Cli streamdeck create
명령으로 생성 될 때 디버깅이 활성화됩니다.
Manifest의 node.js 구성 내에서 디버깅을 구성 할 수 있습니다.
{
// ...
"Nodejs" : {
"Version" : "20" ,
"Debug" : "enabled"
} ,
}
매니페스트 내에서 Debug
속성을 구성 할 때 사용 가능한 네 가지 옵션이 있습니다.
"enabled"
-플러그인은 디버거를 연결할 수 있도록 --inspect
로 실행됩니다."break"
-플러그인은 --inspect-brk
와 함께 시작되며 실행하기 전에 디버거가 부착됩니다.string
- 플러그인에 제공되는 CLI 인수 모음.undefined
- 디버깅이 비활성화되었습니다.플러그인을 디버그 모드
"enabled"
또는"break"
로 실행하면 플러그인이 시작될 때마다 임의의 사용 가능한 포트가 디버그 리스너에 할당됩니다. 특정 포트에서 듣고 싶다면Debug
값은 CLI 인수 문자열로 설정할 수 있습니다 (예 : 포트12345
에서 청취)Debug
값은--inspect=127.0.0.1:12345
입니다.