이 페이지는 Cloud Translation API를 통해 번역되었습니다.

Blockly 및 blockly-samples로 디버깅

블록리 샘플에서 플러그인을 개발할 때 Blockly 자체에서 이에 상응하는 변경을 해야 하는 경우가 있습니다. 대부분의 플러그인은 npm 레지스트리에서 Blockly를 가져오도록 설정되므로 npm에 이미 출시된 코드만 사용할 수 있습니다. 이렇게 하면 Blockly 변경사항을 디버깅하기가 어려워집니다. 블록별 샘플과 블록리 샘플 모두에서 변경사항을 적용하고 테스트하려면 아래 메서드 중 하나를 사용하여 출시되지 않은 변경사항을 함께 사용하면 됩니다.

방법 1: npm 링크

npm 레지스트리에서 패키지를 가져오는 대신 머신의 패키지를 사용하도록 npm에 지정할 수 있습니다. 이 메서드를 사용하면 blockly_compressed를 더 쉽게 디버깅할 수 있는 소스맵에 액세스할 수 있습니다. 이 메서드는 아직 GitHub로 푸시되지 않은 코어 변경사항에 사용할 수 있습니다.

블록리 포크에서 다음 작업을 수행합니다.
```
$ npm run package
$ cd dist
$ npm link
```
이 단계에서는 Core Blockly를 빌드하고, 패키징한 다음, 패키징된 파일에 대한 심볼릭 링크를 만듭니다.
blockly-samples 포크에서 다음을 실행합니다.
```
$ npm link blockly
```
이 단계는 npm에서 패키지를 가져오는 대신 앞에서 만든 심볼릭 링크를 찾도록 npm에 지시합니다.
npm run start하여 플러그인을 테스트합니다.

Core를 변경하는 경우 이를 다시 빌드하고 리패키징해야 합니다.

방법 2: GitHub에서 가져오기

npm 레지스트리가 아닌 GitHub에서 패키지를 가져오도록 npm에 지시할 수 있습니다. 이 메서드를 사용하면 blockly_compressed를 더 쉽게 디버깅할 수 있는 소스맵에 액세스할 수 있습니다. GitHub에 이미 게시된 blockly 버전을 사용해야 합니다.

플러그인의 package.json에 있는 scripts 섹션에 다음이 포함되어 있는지 확인합니다.
```
"postinstall": "blockly-scripts postinstall"
```
이 스크립트는 이후 단계의 GitHub에서 설치된 후에 Blockly를 자동으로 빌드합니다.
package.json에서 blockly용 버전 번호를 제공하는 대신 다음과 같이 Git 주소와 브랜치 이름을 제공합니다.
```
"blockly": "git://github.com/google/blockly.git#develop"
```
병합되지 않은 변경사항이 있는 경우 자체 블록 포크의 링크일 수도 있습니다.
평소 대비 npm install
npm run start: 플러그인 테스트

Core Blockly에서 변경하면 지정된 브랜치의 GitHub로 변경사항을 푸시해야 합니다. 또한 npm이 GitHub에서 새 버전을 가져오도록 하려면 npm uninstall blockly (또는 node_modules에서 삭제)한 다음 위에 설명된 대로 재설치해야 합니다.

방법 3: 고급 플레이그라운드

(핵심 Blockly에 있는) 고급 플레이그라운드를 사용하여 플러그인을 디버그할 수 있습니다. 이 메서드를 사용하면 소스맵에 의존하지 않으므로 디버그하기가 더 쉬울 수 있는 blockly_uncompressed를 사용하게 됩니다. 소스맵으로 디버깅하는 데 문제가 있거나 고급 플레이그라운드의 기능을 사용하여 플러그인을 테스트하려면 이 메서드를 사용하세요.

blockly-samples의 플러그인 디렉터리에서 다음을 실행합니다.
```
$ npm run build
$ cd dist
$ pwd
```
그러면 플러그인이 빌드되고 패키징됩니다. 그런 다음 플러그인의 dist 디렉터리 전체 디렉터리 경로가 출력됩니다. 다음 단계에서 이 경로가 필요하므로 이 경로를 복사합니다.
블록 단위의 advanced_playground.html에서는 다음과 같습니다.
```
<script src="$PATH_TO_DIST_DIR/index.js">
```
그런 다음 플러그인에 필요한 모든 설정도 수행해야 합니다. 예를 들어 옵션 객체에서 특정 값을 지정해야 할 수 있습니다. 기존 작업공간 설정에서 이 작업을 수행합니다.
브라우저에서 고급 플레이그라운드를 열어 플러그인을 테스트합니다.

블록 단위로 변경하면 새로고침만 하면 됩니다. 플러그인을 변경하면 npm run build를 다시 실행해야 합니다.