Cette page a été traduite par l'API Cloud Translation.

Déboguer avec Blockly et blockly-samples

Parfois, lorsque vous développez un plug-in dans Blockly-samples, vous devez apporter les modifications correspondantes dans Blockly lui-même. La plupart des plug-ins sont configurés pour récupérer Blockly à partir du registre npm. Vous ne pourrez donc utiliser que du code déjà publié sur npm. Cela compliquerait le débogage de vos modifications Blockly. Lorsque vous souhaitez apporter et tester des modifications dans des exemples de blocs et de blocs, vous pouvez utiliser l'une des méthodes ci-dessous afin d'utiliser ensemble vos modifications non publiées.

Méthode 1: npm link

Vous pouvez demander à npm d'utiliser un package de votre machine au lieu de le récupérer à partir du registre npm. Avec cette méthode, vous devriez avoir accès à des sourcesmaps qui facilitent le débogage de blockly_compressed. Vous pouvez utiliser cette méthode avec les modifications principales qui n'ont pas encore été transférées vers GitHub.

À la croisée de blockly:
```
$ npm run package
$ cd dist
$ npm link
```
Ces étapes permettent de créer et d'empaqueter le bloc de base Blockly, puis de l'empaqueter, puis de créer un lien symbolique vers les fichiers empaquetés.
Dans votre fourchette de blockly-samples:
```
$ npm link blockly
```
Cette étape indique à npm de rechercher le lien symbolique que vous avez créé précédemment au lieu de récupérer le package depuis npm.
npm run start pour tester votre plug-in.

Lorsque vous apportez des modifications dans la version principale, vous devez le recompiler et le repackager.

Méthode 2: Extraire depuis GitHub

Vous pouvez demander à npm de récupérer un package depuis GitHub plutôt que depuis le registre npm. Avec cette méthode, vous devriez avoir accès à des sourcesmaps qui facilitent le débogage de blockly_compressed. Vous devrez utiliser une version de blockly déjà publiée quelque part sur GitHub.

Assurez-vous que la section scripts du fichier package.json de votre plug-in inclut les éléments suivants:
```
"postinstall": "blockly-scripts postinstall"
```
Ce script créera automatiquement Blockly après l'avoir installé à partir de GitHub lors d'une prochaine étape.
Au lieu de fournir un numéro de version pour blockly dans package.json, indiquez une adresse Git et un nom de branche:
```
"blockly": "git://github.com/google/blockly.git#develop"
```
Il peut également s'agir d'un lien vers votre propre copie de blockly si vous avez des modifications non fusionnées.
npm install comme d'habitude
npm run start pour tester votre plug-in

Lorsque vous apportez des modifications dans Blockly Core, vous devez les transférer vers GitHub au niveau de la branche spécifiée. De plus, si vous souhaitez que npm récupère une nouvelle version à partir de GitHub, vous devez npm uninstall blockly (ou la supprimer de votre node_modules), puis la réinstaller comme décrit ci-dessus.

Méthode 3: Advanced Playground

Vous pouvez utiliser Advanced Playground (dans Blockly) pour déboguer votre plug-in. Avec cette méthode, vous utiliserez blockly_uncompressed, qui peut être plus facile à déboguer, car vous ne vous appuyerez pas sur des sourcesmaps. Utilisez cette méthode si vous rencontrez des problèmes lors du débogage avec des sources de carte ou si vous souhaitez tester votre plug-in à l'aide des fonctionnalités d'Advanced Playground.

Dans le répertoire de plug-ins de blockly-samples:
```
$ npm run build
$ cd dist
$ pwd
```
Cette opération crée et empaquette votre plug-in. Ensuite, il imprime le chemin d’accès complet au répertoire du répertoire dist pour votre plug-in. Copiez ce chemin d'accès ; nous en aurons besoin à l'étape suivante.
Dans "blockly", dans advanced_playground.html:
```
<script src="$PATH_TO_DIST_DIR/index.js">
```
Vous devez ensuite effectuer toutes les configurations requises pour votre plug-in. Par exemple, vous devrez peut-être spécifier certaines valeurs dans l'objet d'options. Effectuez cette configuration dans la configuration de l'espace de travail existant.
Ouvrez Advanced Playground dans votre navigateur pour tester votre plug-in.

Lorsque vous apportez des modifications de manière groupée, il vous suffit d'actualiser la page. Lorsque vous apportez des modifications à votre plug-in, vous devez réexécuter npm run build.