reactive-vscode

Develop VSCode extension with Vue Reactivity API
107,143 825
Install
npm install reactive-vscode
Latest Version:1.0.2
License:MIT
Last Updated:Apr 29, 2026
Links: GitHub  ·  npm
Maintainer: _kerman

reactive-vscode

npm version npm downloads License

Develop VSCode extension with Vue Reactivity API

Project Status

Currently, most of the VSCode APIs are covered, and this project has been used in:

The documentation is complete, and the VueUse integration is also available.

However, the project is still in its 0.x and may have minor API changes. If you encounter any problems, please feel free to open an issue.

Counter Example

import { defineExtension, ref, useCommands, useStatusBarItem } from 'reactive-vscode'
import { StatusBarAlignment } from 'vscode'

export = defineExtension(() => {
  const counter = ref(0)

  useStatusBarItem({
    alignment: StatusBarAlignment.Right,
    priority: 100,
    text: () => `Hello ${counter.value}`,
  })

  useCommands({
    'extension.sayHello': () => counter.value++,
    'extension.sayGoodbye': () => counter.value--,
  })
})
import type { ExtensionContext } from 'vscode'
import { commands, StatusBarAlignment, window } from 'vscode'

export function activate(extensionContext: ExtensionContext) {
  let counter = 0

  const item = window.createStatusBarItem(StatusBarAlignment.Right, 100)

  function updateStatusBar() {
    item.text = `Hello ${counter}`
    item.show()
  }

  updateStatusBar()

  extensionContext.subscriptions.push(
    commands.registerCommand('extension.sayHello', () => {
      counter++
      updateStatusBar()
    }),
    commands.registerCommand('extension.sayGoodbye', () => {
      counter--
      updateStatusBar()
    }),
  )
}

More examples.

License

MIT License © 2024-PRESENT _Kerman

Source code in the ./packages/reactivity directory is ported from @vue/runtime-core. Licensed under a MIT License.

Source code in the ./packages/mock directory references the implementation of VSCode. Licensed under a MIT License.

The logo is modified from Vue Reactivity Artworks. Licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

Part of the docs website is ported from VueUse. Licensed under a MIT License.

Related Packages

@reactive-vscode/vueuse

Useful VueUse utilities for VSCode extension development

28,742 826
@directive-run/vue

Vue composition API adapter for Directive.

13,087 5
@lytjs/reactivity

LytJS reactive system - signals, refs, computed, watch, and effects

6,562
@composy/i18n-vue

Vue 3 integration for @composy/i18n-core - Powerful i18n solution with compositi...

0
vue-fn

A Vue 3 reactive function utility library providing domain-driven design pattern...

3,123 0

Version History

Version Released License
1.0.2 MIT
1.0.1 MIT
1.0.0 MIT
0.4.1 MIT
0.4.0 MIT
Pre-releases (19)
Version Released License
1.0.0-beta.2 MIT
1.0.0-beta.1 MIT
0.2.7-beta.1 MIT
0.2.6-beta.1 MIT
0.2.0-beta.9 MIT