JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 59391
  • Score
    100M100P100Q160108F
  • License MIT

Load languages Extensions for CodeMirror6.

Package Exports

  • @uiw/codemirror-extensions-langs

Readme

Using my app is also a way to support me:
Keyzer Vidwall Hub VidCrop Vidwall Mousio Hint Mousio Musicer Audioer FileSentinel FocusCursor Videoer KeyClicker DayBar Iconed Mousio Quick RSS Quick RSS Web Serve Copybook Generator DevTutor for SwiftUI RegexMate Time Passage Iconize Folder Textsound Saver Create Custom Symbols DevHub Resume Revise Palette Genius Symbol Scribe

Load languages Extensions

Buy me a coffee npm version

Load languages Extensions for CodeMirror6.

Install

npm install @uiw/codemirror-extensions-langs --save
import { loadLanguage, langNames, langs } from '@uiw/codemirror-extensions-langs';

loadLanguage('tsx');

langs.tsx();

console.log('langNames:', langNames); // => "jsx" | "ts" | "js" | "tsx"

Usage

import CodeMirror from '@uiw/react-codemirror';
import { langs } from '@uiw/codemirror-extensions-langs';

function App() {
  return <CodeMirror value="console.log('hello world!');" height="200px" extensions={[langs.tsx()]} />;
}
export default App;
import CodeMirror from '@uiw/react-codemirror';
import { loadLanguage } from '@uiw/codemirror-extensions-langs';

function App() {
  return <CodeMirror value="console.log('hello world!');" height="200px" extensions={[loadLanguage('tsx')]} />;
}
export default App;
import { EditorView } from '@codemirror/view';
import { EditorState } from '@codemirror/state';
import { loadLanguage, langs } from '@uiw/codemirror-extensions-langs';

const state = EditorState.create({
  doc: 'my source code',
  extensions: [langs.jsx()],
});

const view = new EditorView({
  parent: document.querySelector('#editor'),
  state,
});

Support Language

Open in CodeSandbox

import CodeMirror from '@uiw/react-codemirror';
import { StreamLanguage } from '@codemirror/language';
import { go } from '@codemirror/legacy-modes/mode/go';

const goLang = `package main
import "fmt"

func main() {
  fmt.Println("Hello, δΈ–η•Œ")
}`;

export default function App() {
  return <CodeMirror value={goLang} height="200px" extensions={[StreamLanguage.define(go)]} />;
}

Contributors

As always, thanks to our amazing contributors!

Made with github-action-contributors.

License

Licensed under the MIT License.