# @scalar/use-codemirror

> CodeMirror for Vue

Latest version **0.14.15** (published 2026-08-20) · MIT license · 0 weekly downloads

## Install

```sh
npm install @scalar/use-codemirror
pnpm add @scalar/use-codemirror
yarn add @scalar/use-codemirror
bun add @scalar/use-codemirror
```

## Health

**Score 80/100 (A)** — status: active.

Positive: has types; esm support; no vulnerabilities; has provenance; recently updated; high maintenance score; high quality score; popular repo.

Warnings: low downloads; pre 1.0.

## Facts

| | |
|---|---|
| Version | 0.14.15 |
| Published | 2026-08-20 |
| First published | 2023-08-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=22 |
| Dependencies | 15 |
| Unpacked size | 72.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 16149 |
| Author | Scalar |
| Maintainers | cameronrohani, marclave, scalar_geoff, hwkr, hanspagel, amritk, scalar-machine |
| Keywords | codemirror, composable, vue, vue3 |

## Links

- npm: https://www.npmjs.com/package/@scalar/use-codemirror
- Repository: https://github.com/scalar/scalar
- Issues: https://github.com/scalar/scalar/issues/new/choose
- npm.io page: https://npm.io/package/@scalar/use-codemirror

## Dependencies (15)

- [vue](https://npm.io/package/vue.md) ^3.5.40
- [@lezer/common](https://npm.io/package/@lezer/common.md) ^1.2.3
- [@codemirror/lint](https://npm.io/package/@codemirror/lint.md) ^6.8.4
- [@codemirror/view](https://npm.io/package/@codemirror/view.md) ^6.35.3
- [@lezer/highlight](https://npm.io/package/@lezer/highlight.md) ^1.2.1
- [@codemirror/state](https://npm.io/package/@codemirror/state.md) ^6.5.0
- [@codemirror/commands](https://npm.io/package/@codemirror/commands.md) ^6.7.1
- [@codemirror/lang-css](https://npm.io/package/@codemirror/lang-css.md) ^6.3.1
- [@codemirror/lang-xml](https://npm.io/package/@codemirror/lang-xml.md) ^6.0.0
- [@codemirror/language](https://npm.io/package/@codemirror/language.md) ^6.10.7
- [@codemirror/lang-html](https://npm.io/package/@codemirror/lang-html.md) ^6.4.8
- [@codemirror/lang-json](https://npm.io/package/@codemirror/lang-json.md) ^6.0.0
- [@codemirror/lang-yaml](https://npm.io/package/@codemirror/lang-yaml.md) ^6.1.2
- [@codemirror/autocomplete](https://npm.io/package/@codemirror/autocomplete.md) ^6.18.3
- [@replit/codemirror-css-color-picker](https://npm.io/package/@replit/codemirror-css-color-picker.md) ^6.3.0

## Recent versions

- 0.14.15 (latest) — 2026-08-20
- 0.14.14 — 2026-07-16
- 0.14.13 — 2026-07-15
- 0.14.12 — 2026-06-17
- 0.14.11 — 2026-04-03
- 0.14.10 — 2026-03-18
- 0.14.9 — 2026-03-17
- 0.14.8 — 2026-03-15
- 0.14.7 — 2026-03-13
- 0.14.6 — 2026-03-12
- 0.14.5 — 2026-03-11
- 0.14.4 — 2026-03-10
- 0.14.3 — 2026-03-10
- 0.14.2 — 2026-03-09
- 0.14.1 — 2026-03-05
- … 246 more at https://npm.io/package/@scalar/use-codemirror/versions

## README

# CodeMirror Hook for Vue

[![Version](https://img.shields.io/npm/v/%40scalar/use-codemirror)](https://www.npmjs.com/package/@scalar/use-codemirror)
[![Downloads](https://img.shields.io/npm/dm/%40scalar/use-codemirror)](https://www.npmjs.com/package/@scalar/use-codemirror)
[![License](https://img.shields.io/npm/l/%40scalar%2Fuse-codemirror)](https://www.npmjs.com/package/@scalar/use-codemirror)
[![Discord](https://img.shields.io/discord/1135330207960678410?style=flat&color=5865F2)](https://discord.gg/scalar)

---

Scalar is an open-source API platform for teams who want beautiful developer interfaces without vendor lock-in.

- **[API References](https://scalar.com/products/api-references/getting-started)** — Interactive API documentation from OpenAPI and AsyncAPI specs.
- **[Developer Docs](https://scalar.com/products/docs/getting-started)** — Write in Markdown/MDX, generate API references, sync with two-way Git.
- **[SDK Generator](https://scalar.com/products/sdk-generator/getting-started)** — Type-safe SDKs and CLIs in TypeScript, Python, Go, PHP, Java, and Ruby.
- **[API Client](https://scalar.com/products/api-client/getting-started)** — Open-source, offline-first Postman alternative built on OpenAPI.

20M+ monthly npm installs · 15,500+ GitHub stars · MIT licensed · [scalar.com](https://scalar.com)

---

## Installation

```bash
npm install @scalar/use-codemirror
```

## Usage

```vue
<script setup>
import { useCodeMirror } from '@scalar/use-codemirror'
import { ref } from 'vue'

const editor = ref(null)

const { codeMirror, setCodeMirrorContent } = useCodeMirror({
  codeMirrorRef: editor,
  content: '{ "foo": "bar" }',
  language: 'json',
  lineNumbers: true,
  onChange: (value) => {
    console.log('Content changed:', value)
  },
})
</script>

<template>
  <div ref="editor" />
</template>
```

## Community

We are API nerds. You too? Let's chat on Discord: <https://discord.gg/scalar>

## License

The source code in this repository is licensed under [MIT](https://github.com/scalar/scalar/blob/main/LICENSE).

---
_Source: https://npm.io/package/@scalar/use-codemirror · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._