docx-editor

Open-source WYSIWYG .docx editor for React and Vue. Word-faithful pagination, tracked changes, comments, and lossless round-trip: untouched content and unsupported OOXML survive the save. Live demo | Documentation | Roadmap

Quick start

npm install @docx-editor.dev/react @docx-editor.dev/core   # React
npm install @docx-editor.dev/vue @docx-editor.dev/core     # Vue

See the React or Vue quick start.

For Node.js, use ^20.16.0 || >=22.3.0. Browser applications can use the packages with their build tool.

Packages

@docx-editor.dev/editor-api and @docx-editor.dev/pro are licensed under the EigenPal Pro License (editor-api, pro), and you can compare and buy license and support levels on the pricing page.

If you fork an adapter, depend on @docx-editor.dev/core to receive engine fixes.

React

import { useState } from 'react';
import { DocxEditor } from '@docx-editor.dev/react';
import '@docx-editor.dev/core/styles/editor.css';

export function App() {
  const [doc, setDoc] = useState();

  return (
    

    
  );
}

Next.js / SSR: Use dynamic import. The editor requires the DOM.

Full docs: React adapter · Props and ref methods.

Vue

Nuxt / SSR: Load the editor in a client-only component. The editor requires the DOM.

Full docs: Vue adapter · Props and ref methods.

Font measurement

Pass usable font bytes for Word-accurate line and page breaks. Without them, the editor uses fallback measurement that does not guarantee Word-compatible layout.

Use packagedFonts() from @docx-editor.dev/fonts for packaged substitutes. Use customFonts() from @docx-editor.dev/core/editor for your own font files. Add googleFonts() when your application accepts third-party font requests.

See Fonts and measurement.

Development

bun install
bun run dev          # localhost:5173
bun run dev:markdown # Markdown demo: localhost:5177
bun run build
bun run typecheck

Try unreleased changes in the preview of main.

Examples: Vite | DOCX to Markdown | Next.js | Remix | Astro | Vue | Collaboration | Server agent review

Documentation | React props and ref methods | Vue props and ref methods

Contributing

Contributions welcome. See CONTRIBUTING.md for setup, tests, and the one-time CLA signature.

Translations

To add a locale, see the i18n contribution guide.

bun run i18n:new de      # scaffold German locale
bun run i18n:status      # check translation coverage

License

This repository is licensed under Apache 2.0, except packages/editor-api/ and packages/pro/, which are licensed under the EigenPal Pro License (editor-api, pro); you can compare and buy license and support levels on the pricing page.

Commercial support

[!TIP] Questions or custom features? Email [email protected].

Roadmap

See the public roadmap for planned work and priorities.