docx-editor
Darmowy edytor dokumentów

Edytor dokumentów WYSIWYG sterowany przez agentów AI. Używa specyfikacji Office Open XML (OOXML) jako modelu danych do bezstratnego parsowania i edycji dokumentów Word.

npm version github stars license
Wypróbuj online Repozytorium GitHub

Kluczowe cechy i zalety

Inteligentne wsparcie agentów AI

Głęboka integraсja z asystentem AI wspierającym pisanie kontekstowe, automatyczne uzupełnianie tekstu, inteligentną korektę gramatyczną, podsumowywanie treści i generowanie ustrukturyzowanych dokumentów.

Natywny model danych OOXML

Bez stratnej konwersji typu „Word -> HTML -> Word”. Bezpośrednio obsługujemy specyfikację Office Open XML, w 100% mapując strukturę dokumentu Word i eliminując utratę stylów.

Działanie w 100% w przeglądarce

Działa w pełni w przeglądarce, bez potrzeby konfiguracji drogich serwerów renderujących. Zapewnia doskonały czas odpowiedzi, tryb offline oraz pełne bezpieczeństwo danych.

Profesjonalna edycja dokumentów

Kompletne doświadczenie WYSIWYG. Obsługuje śledzenie zmian (Track Changes), komentarze z wątkami odpowiedzi (Comments), zaawansowane tabele i formatowanie, wstawianie obrazów i wiele więcej.

Open-source i przyjazny komercyjnie

Oparty na liberalnej licencji Apache 2.0. Całkowicie bezpłatny i gotowy do użytku komercyjnego. Modyfikacja kodu nie wymaga ujawniania kodu własnych systemów.

Rozszerzalna architektura wtyczek

Modułowa budowa i luźno powiązane wtyczki. Deweloperzy mogą dostosowywać pasek narzędzi, rozszerzać polecenia oraz przechwytywać kluczowe zdarzenia edycji.

Typowe scenariusze użycia

01

Własny edytor dokumentów AI

Dzięki działaniu po stronie klienta firmy mogą szybko zbudować własny system edycji zintegrowany z AI. Połączenie z lokalnymi modelami LLM chroni poufne dokumenty bez chmur trzecich.

02

Integracja z bazami wiedzy (RAG)

Integracja z wewnętrznymi bazami wiedzy i słownikami pozwala na wyszukiwanie semantyczne podczas edycji. Asystent AI dostarcza dokładne korekty i rekomendacje terminów.

03

Edycja umów i dokumentów handlowych

Szybkie tworzenie i dokładna weryfikacja umów. Dzięki pełnej zgodności z OOXML sztuczna inteligencja może automatycznie wykrywać błędy i ryzyka prawne w umowach.

WYBÓR TECHNOLOGICZNY

Dlaczego to najlepszy wybór dla własnego edytora AI?

Wybór technologii jest kluczowy przy wdrażaniu edytora AI. Unikalna architektura docx-editor rozwiązuje wyzwania kompatybilności, wydajności i głębokości integracji.

Szybkie wdrożenie i elastyczność

Gotowe adaptery dla React i Vue 3. Programiści nie muszą uczyć się silnika renderowania — wdrożenie edycji dokumentów Word i AI zajmie tylko kilka dni.

Wieloplatformowa integracja

Zbudowany w standardowych technologiach webowych. Jeden komponent działa na komputerach, urządzeniach mobilnych (obsługa gestów dotykowych) oraz w aplikacjach natywnych.

Bezproblemowa zgodność z Word

Wykorzystanie formatu DOCX zapobiega zniekształceniom stylów. Pełna zgodność z Microsoft Word zapewnia pracownikom przyjazny i znany interfejs.

Głęboka integracja z formatowaniem AI

W przeciwieństwie do tradycyjnych czatów AI, asystent może bezpośrednio poprzez API kontrolować style tekstu, listy, tabele i wcięcia akapitów.

WSPÓŁPRACA W CZASIE RZECZYWISTYM

Współpraca w czasie rzeczywistym

docx-editor ma wbudowaną współpracę opartą na Yjs (model danych CRDT), umożliwiając wielu użytkownikom jednoczesną edycję tego samego pliku Word:

  • Podświetlanie kursorów i zaznaczeń innych użytkowników na żywo
  • Automatyczne łączenie wersji offline bez blokad plików w oparciu o algorytm CRDT
  • Elastyczne konektory współpracujące z WebSockets, WebRTC lub własnymi bramkami
Użytkownik AUżytkownik B
TRYB BEZGŁOWY SERWERA

Tryb Headless bez renderowania DOM

Architektura oddziela jądro od interfejsu graficznego, co pozwala wydajnie przetwarzać dokumenty Word w środowisku Node.js lub CLI:

  • Masowe wstrzykiwanie zmiennych, wypełnianie szablonów i generowanie raportów na serwerze
  • Brak wymogu wirtualnej przeglądarki (np. Puppeteer/JSDOM) gwarantuje wysoką wydajność
  • Możliwość wstępnego renderowania dokumentów z poziomu CLI lub backendu za pomocą wtyczek
$ npm run compile-reportLoading docx template [success]Injecting dataset variables... (124 fields)Output saved to ./report_2026.docx

Porównanie edytorów open-source

Wybór biblioteki open-source to poważna decyzja. Poniżej znajduje się zestawienie różnic pomiędzy docx-editor a edytorem SuperDoc:

Kryterium docx-editor SuperDoc
Licencja open-source (użycie komercyjne) Apache 2.0 (bardzo liberalna)

Całkowicie bezpłatny w zastosowaniach komercyjnych. Brak wymogu udostępniania własnego kodu przy modyfikacjach, 0 ryzyka i kosztów.

 AGPL 3.0 (licencja restrykcyjna)

Udostępnianie oprogramowania w sieci zmusza do upublicznienia kodu całego systemu komercyjnego. Dla zamkniętego użycia wymagana płatna лицензия.
Wsparcie dla języków azjatyckich (CJK) Pełne wsparcie dla klawiatur CJK

Dokładna obsługa zdarzeń klawiatury IME (dla chińskiego, japońskiego i koreańskiego) gwarantuje stabilne wprowadzanie znaków bez błędu kursora.

 Słabe wsparcie (poważne błędy)

Błędy w obsłudze zdarzeń Composition prowadzą do dublowania znaków i problemów z kursorem podczas pisania w językach azjatyckich.
Dojrzałość i stabilność projektu Wysoka dojrzałość

Wbudowana synchronizacja Yjs, oddzielenie jądra od widoku, stabilność potwierdzona w środowiskach produkcyjnych.

 Projekt w fazie rozwoju

Niektóre zaawansowane funkcje formatowania są nadal eksperymentalne i wymagają dopracowania.

Быстрая интеграция в проект

1. Instalacja pakietu React i zależności

# Instalacja stabilnej wersji adaptera React
npm install @eigenpal/docx-editor-react

2. Import i konfiguracja w komponencie

import React, { useState } from 'react';
import { DocxEditor } from '@eigenpal/docx-editor-react';
// Import stylów dla paska narzędzi i obszaru edycji
import '@eigenpal/docx-editor-react/styles.css';

function DocumentWorkspace() {
  const [docBuffer, setDocBuffer] = useState(null);

  const handleSave = (updatedBuffer) => {
    // updatedBuffer to zmodyfikowane binarne dane Word (ArrayBuffer)
    console.log('Aktualizacja dokumentu:', updatedBuffer);
  };

  return (
    <div style={{ height: '80vh', border: '1px solid rgba(255,255,255,0.08)' }}>
      <DocxEditor
        documentBuffer={docBuffer}
        onSave={handleSave}
      />
    </div>
  );
}

export default DocumentWorkspace;

1. Instalacja pakietu Vue 3 i zależności

# Instalacja pakietu dedykowanego dla Vue 3
npm install @eigenpal/docx-editor-vue

2. Tworzenie komponentu Vue

<template>
  <div class="editor-container">
    <DocxEditor
      :documentBuffer="docBuffer"
      @save="handleSave"
    />
  </div>
</template>

<script setup>
import { ref } from 'vue';
import { DocxEditor } from '@eigenpal/docx-editor-vue';
// Import stylów CSS do renderowania interfejsu
import '@eigenpal/docx-editor-vue/styles.css';

const docBuffer = ref(null);

const handleSave = (updatedBuffer) => {
  // Pobieranie danych ArrayBuffer w celu zapisu w chmurze lub lokalnie
  console.log('Aktualizacja dokumentu w Vue:', updatedBuffer);
};
</script>

<style scoped>
.editor-container {
  height: 80vh;
  border: 1px solid rgba(255, 255, 255, 0.08);
}
</style>