JSFiddle - React, Tailwind, and code Playground

by no2don

HTML

<script src="https://unpkg.com/[email protected]/min/vs/loader.js"></script>
<script src="https://unpkg.com/[email protected]/min/vs/editor/editor.main.nls.js"></script>
<script src="https://unpkg.com/[email protected]/min/vs/editor/editor.main.js"></script>
<div id="container"></div>

CSS

html, body, #container {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

JavaScript

require.config({
  paths: {
    'vs': 'https://unpkg.com/[email protected]/min/vs'
  }
});




var editor = monaco.editor.create(document.getElementById('container'), {
  language: 'html',
  theme: 'vs-dark',
  tabCompletion: 'on',
  cursorSmoothCaretAnimation: true,
  formatOnPaste: true,
  mouseWheelZoom: true,
  autoClosingBrackets: "always",
  autoClosingOvertype: "always",
  autoClosingQuotes: "always",
  automaticLayout: "always"
});