docx-html-converter

Конвертер DOCX в HTML на Rust с поддержкой WASM. Преобразует документы Word в HTML с сохранением стилей, таблиц, списков, заголовков и колонтитулов. Верхний padding основного контента равен высоте зоны header (вычисляется после рендера колонтитулов).

Установка

npm install docx-html-converter

API

convert_docx(docx_buffer, no_h4?, debug_layout?)

Конвертирует DOCX в полный HTML-документ (DOCTYPE, html, head, body).

• docx_buffer — Uint8Array с байтами .docx файла
• no_h4 — опционально; при true жирный из стиля параграфа (например, Heading 4) не применяется к элементам списка
• debug_layout — опционально; при true добавляет яркие цветные рамки для отладки (красный=страница, зелёный=контент, синий=header, оранжевый=footer, фиолетовый=таблица)

import { convert_docx } from 'docx-html-converter';

const response = await fetch('/document.docx');
const buffer = new Uint8Array(await response.arrayBuffer());
const html = convert_docx(buffer);

convert_docx_embed(docx_buffer, no_h4?, debug_layout?)

Конвертирует DOCX в встраиваемый HTML-фрагмент (div со стилями, без обёртки документа). Подходит для вставки в существующую страницу. При debug_layout: true — цветные рамки для отладки (см. выше).

Каждый div страницы (.page) имеет id="document-docx-{номер}" и атрибут contenteditable для редактирования на фронтенде.

import { convert_docx_embed } from 'docx-html-converter';

const embed = convert_docx_embed(buffer);
document.getElementById('editor').innerHTML = embed;
// Каждая страница: <div class="page" id="document-docx-1" contenteditable>...

calculate_html(html)

Пересчитывает разбиение на страницы в HTML «по-вордовски». Используйте при редактировании текста в contentEditable — передайте обновлённый HTML, чтобы получить переразбитый контент.

import { convert_docx_embed, calculate_html } from 'docx-html-converter';

const embed = convert_docx_embed(buffer);
const container = document.getElementById('editor');
container.innerHTML = embed;

// Для пересчёта страниц нужен полный HTML: обёртка docx-html-embed + стили + страницы
container.addEventListener('input', () => {
  const htmlForRecalc = getHtmlForRecalculate(container);
  const recalculated = calculate_html(htmlForRecalc);
  container.innerHTML = recalculated;
});

/**
 * Возвращает HTML, готовый для calculate_html.
 * Нужен полный фрагмент: div.docx-html-embed + <style> + страницы.
 * container — либо сам embed, либо родитель (например #editor).
 */
function getHtmlForRecalculate(container: HTMLElement): string {
  const embed =
    container.closest?.('.docx-html-embed') ??
    container.querySelector?.('.docx-html-embed') ??
    container;
  return embed.outerHTML;
}

Сборка и запуск

DOCX → HTML (Rust)

cargo run                    # выбор .docx из src/files/
cargo run -- file.docx       # указать файл

HTML → DOCX

# Сначала: npm install в packages/html-docx-converter
cd packages/html-docx-converter && npm install && cd ../..

cargo run -- to-docx                    # выбор .html из списка
cargo run -- to-docx output-embed.html   # указать файл

Результат сохраняется в packages/html-docx-converter/files/docx_results/.

npm (Node.js)

# Для bundler (webpack, vite и т.д.)
npm run build

# Для Node.js
npm run build:node

Rust

Библиотека также доступна как Rust crate:

use docx_html_converter::{convert_docx_from_bytes, convert_docx_embed_from_bytes, calculate_html};

let html = convert_docx_from_bytes(&docx_bytes, false, false)?;
let embed = convert_docx_embed_from_bytes(&docx_bytes, false, false)?;
// With debug layout (bright borders: red=page, green=content, blue=header, orange=footer, magenta=table):
let embed_debug = convert_docx_embed_from_bytes(&docx_bytes, false, true)?;
let recalculated = calculate_html(&embed)?;

Changelog

0.4.4

• Исправлена вёрстка embed: BOM (U+FEFF) в header/footer больше не создаёт пустые span и не вызывает наезд header на page-content.