介紹

Monaco Editor是為VS Code提供支持的代碼編輯器，運(yùn)行在瀏覽器環(huán)境中。編輯器提供代碼提示，智能建議等功能。供開發(fā)人員遠(yuǎn)程更方便的編寫代碼。移動(dòng)瀏覽器或移動(dòng)Web框架不支持Monaco編輯器。簡(jiǎn)單的理解就是VSCode中的代碼編輯器和Monaco Editor使用的很多相同的核心模塊，你可以將Monaco Editor用到自己的項(xiàng)目中，作為云端編輯器的支持，支持IE 11，Edge，Chrome，Firefox，Safari和Opera！

---

---

相關(guān)地址

Github：

https://github.com/microsoft/monaco-editor

文檔和示例等：

https://microsoft.github.io/monaco-editor/

安裝

安裝沒什么好說的，你可以到上面地址中下載，也可以直接使用npm安裝

npm install monaco-editor@0.17.0

---

特性

• 以下語(yǔ)言豐富的智能感知以及驗(yàn)證功能

TypeScript, JavaScript, CSS, LESS, SCSS, JSON, HTML

---

---

• 多數(shù)語(yǔ)言支持的語(yǔ)法著色(高亮)支持

XML, PHP, C#, C++, Razor, Markdown, Diff, Java, VB, CoffeeScript, Handlebars, Batch, Pug, F#, Lua, Powershell, Python, Ruby, SASS, R, Objective-C……

---

---

• 代碼差異比較

內(nèi)聯(lián)代碼差異比較

---

---

非內(nèi)聯(lián)代碼差異比較

---

---

• 內(nèi)置三種主題(用過VSCode都知道)

上面都是原生Visual Studio亮色主題

Visual Studio Dark主題：

---

---

高對(duì)比度暗色主題：

---

---

快速開始

想要直接開發(fā)可能不是一件非常簡(jiǎn)單的事情，所以給出官網(wǎng)提供的所有示例，建議感興趣的同學(xué)可以直接下載下來(lái)查看相關(guān)示例代碼

https://github.com/Microsoft/monaco-editor-samples/

1、在終端執(zhí)行以下四條命令，前提是你已存在git和node的環(huán)境，如果不存在則先安裝git或者node

---

git clone https://github.com/Microsoft/monaco-editor-samples.gitcd monaco-editor-samplesnpm install .npm run simpleserver

---

2、然后訪問http://localhost:8888即可體驗(yàn)

選擇你想體驗(yàn)的示例，有一些可能還需要其他的操作，按照提示來(lái)即可

---

---

3、項(xiàng)目示例Demo介紹

---

---

• browser-amd-editor:

使用AMD延遲加載在瀏覽器中運(yùn)行

• browser-script-editor

通過

總結(jié)

以上是生活随笔為你收集整理的java在线编辑器_微软开源在线代码编辑器——Monaco Editor的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。