---
title: "Блок «Код» — подсветка синтаксиса и языки"
description: "Блоки кода с подсветкой синтаксиса, выбором языка и копированием, а также поля code и language, которые он хранит."
source: https://blokeditor.com/ru/docs/code/
lastmod: 2026-10-01
---

Фреймворк JavaScript

Блочные инструменты Код

# Код: подсветка синтаксиса

Блок кода с подсветкой синтаксиса, выбором языка, необязательной нумерацией строк и кнопкой копирования в буфер обмена. Поддерживает более 30 языков через Prism. У языков LaTeX и Mermaid есть вкладка с живым предпросмотром.

Вставка markdown-блоков кода в тройных обратных кавычках (```) или элементов`<pre>`автоматически создаёт блок кода. Язык подхватывается всякий раз, когда вставляемый источник его называет: блок, открывающийся строкой```sql, или помеченный блок кода, скопированный из приложения вроде Gemini.

### Импорт

TypeScript

```
import { Code } from '@bloklabs/core/tools';
```

### Формат данных

TypeScript

```
interface CodeData {
  code: string;          // Raw code text (not HTML)
  language: string;      // Language identifier, e.g. "javascript", "plain text"
  lineNumbers?: boolean; // Whether to show line numbers in the gutter
  filename?: string;     // File name shown above the code, e.g. "block.ts"
}
```

JSON

```
{
  "id": "cod001",
  "type": "code",
  "data": {
    "code": "const greeting = 'hello';\nconsole.log(greeting);",
    "language": "javascript",
    "lineNumbers": true
  }
}
```

### Пример использования

TypeScript

```
import { Blok } from '@bloklabs/core';
import { Code } from '@bloklabs/core/tools';

const editor = new Blok({
  holder: 'editor',
  tools: {
    code: {
      class: Code,
      inlineToolbar: false,
    },
  },
});
```