Membuat dan menjalankan kode

Aplikasi Anda dapat membuat kode kapan saja. Misalnya, aplikasi dapat membuat kode saat pengguna akhir mengklik tombol atau setiap kali pengguna melakukan perubahan.

Untuk ringkasan pembuatan kode, lihat Code generation.

Mengimpor generator kode bahasa

Untuk membuat kode, Anda memerlukan generator kode bahasa. Anda dapat mengimpor generator kode bahasa dengan salah satu metode berikut.

Modul

import {javascriptGenerator} from 'blockly/javascript';
import {pythonGenerator} from 'blockly/python';
import {phpGenerator} from 'blockly/php';
import {luaGenerator} from 'blockly/lua';
import {dartGenerator} from 'blockly/dart';

// Generate code for all the blocks in the workspace.
const jsCode = javascriptGenerator.workspaceToCode(workspace);
const pythonCode = pythonGenerator.workspaceToCode(workspace);
const phpCode = phpGenerator.workspaceToCode(workspace);
const luaCode = luaGenerator.workspaceToCode(workspace);
const dartCode = dartGenerator.workspaceToCode(workspace);

Unpkg

Anda harus menyertakan generator setelah menyertakan Blockly.

<script src="https://unpkg.com/blockly"></script>
<script src="https://unpkg.com/blockly/javascript_compressed"></script>
<script src="https://unpkg.com/blockly/python_compressed"></script>
<script src="https://unpkg.com/blockly/php_compressed"></script>
<script src="https://unpkg.com/blockly/lua_compressed"></script>
<script src="https://unpkg.com/blockly/dart_compressed"></script>

// Generate code for all the blocks in the workspace.
const jsCode = javascript.javascriptGenerator.workspaceToCode(workspace);
const pythonCode = python.pythonGenerator.workspaceToCode(workspace);
const phpCode = php.phpGenerator.workspaceToCode(workspace);
const luaCode = lua.luaGenerator.workspaceToCode(workspace);
const dartCode = dart.dartGenerator.workspaceToCode(workspace);

Skrip lokal

Anda harus menyertakan generator setelah menyertakan Blockly.

<script src="blockly_compressed.js"></script>
<script src="javascript_compressed.js"></script>
<script src="python_compressed.js"></script>
<script src="php_compressed.js"></script>
<script src="lua_compressed.js"></script>
<script src="dart_compressed.js"></script>

// Generate code for all the blocks in the workspace.
const jsCode = javascript.javascriptGenerator.workspaceToCode(workspace);
const pythonCode = python.pythonGenerator.workspaceToCode(workspace);
const phpCode = php.phpGenerator.workspaceToCode(workspace);
const luaCode = lua.luaGenerator.workspaceToCode(workspace);
const dartCode = dart.dartGenerator.workspaceToCode(workspace);

Membuat kode

Untuk membuat kode, gunakan fungsi workspaceToCode generator.

const code = javascriptGenerator.workspaceToCode(workspace);

Update berkelanjutan

Update berkelanjutan memungkinkan Anda menampilkan atau menjalankan kode setiap kali pengguna melakukan perubahan. Membuat kode adalah operasi yang cepat, sehingga tidak banyak berdampak pada performa. Hal ini dilakukan menggunakan pemroses peristiwa.

const supportedEvents = new Set([
  Blockly.Events.BLOCK_CHANGE,
  Blockly.Events.BLOCK_CREATE,
  Blockly.Events.BLOCK_DELETE,
  Blockly.Events.BLOCK_MOVE,
]);

function updateCode(event) {
  if (workspace.isDragging()) return; // Don't update while changes are happening.
  if (!supportedEvents.has(event.type)) return;

  const code = javascriptGenerator.workspaceToCode(workspace);
  document.getElementById('textarea').value = code;
}

workspace.addChangeListener(updateCode);

Menambahkan kode pembuka atau penutup

Setelah membuat kode, Anda dapat menyertakan kode sebelum awal atau setelah akhir kode yang dibuat.

let code = javascriptGenerator.workspaceToCode(workspace);
// Add a preamble and a postscript to the code.
const preamble = 'import {MyLibrary} from \'/path/to/my/library\';\n'
const postscript = 'MyLibrary.myKickoffFunction();\n';
code = preamble + code + postscript;

Kode pembuka biasanya digunakan untuk menyertakan definisi eksternal di awal kode. Kode penutup biasanya digunakan untuk memanggil fungsi untuk memulai perilaku di akhir kode.

Jika kode yang dibuat dapat dijalankan sebagaimana adanya, Anda tidak perlu menyertakan kode pembuka atau penutup.

Mengeksekusi kode

Setelah membuat kode, Anda harus mengetahui cara mengeksekusinya. Keputusan tentang cara mengeksekusinya sangat spesifik untuk aplikasi, dan berada di luar cakupan Blockly.

Jika Anda ingin mengeksekusi kode JavaScript, lihat Membuat dan menjalankan JavaScript. Bagian ini membahas beberapa fitur khusus generator kode JavaScript, serta JSInterpreter, yang direkomendasikan oleh tim Blockly sebagai cara untuk mengeksekusi JavaScript dengan aman.

Bahasa lain memerlukan alat lain.