Nuxt Monaco Editor

The easist way to get along with Monaco Editor.

Get Started

Zero Configuration

All you have to do is to import the module in Nuxt Config.

Localization

Including Localization support, just switch on your config.

Nuxt3 Ready

Built on Vue 3, can use very easily by Auto-imports and Composables.

Setup

  1. Install dependencies
# npm
npm install -D monaco-editor nuxt-monaco-editor

# yarn
yarn add -D monaco-editor nuxt-monaco-editor

# pnpm
pnpm add -D monaco-editor nuxt-monaco-editor
  1. Add this module to the Nuxt config
export default defineNuxtConfig({
  modules: [
    'nuxt-monaco-editor'
  ]
})
  1. Use the component in your pages or components
<template>
  <MonacoEditor lang="typescript" />
</template>