前面两篇文章分别向大家介绍了搭建monaco-editor的本地开发环境,以及为什么学习它。本篇文章我们就正式踏入学习阶段,希望我们大家都准备好坚定好自己的目标,守护好自己的信念。真正花上几个月时间,好好研究monaco-editor的使用和开发。
学习一个东西最简单的起步就是写一个Hello world了。本篇文章就向大家介绍使用monaco-editor写一个 Hello World 的案例,并详细介绍其中设计的参数与配置。
由于monaco-editor是一个非常庞大的项目,光是集成方式就至少5中以上,amd
,esm
,electron
,webpack
,ts
,vite
,requirejs
。。。第一次接触我们就不要把步子迈那么大,本篇只讲在不使用任何框架下,单个纯html文件使用script
标签来引入monaco-editor资源,并实现hello world示例。
在单个html文件里实现一个monaco编辑器是非常简单的。但也有很多注意点。下面让我们一起看一下。
首先创建一个index.html
内容如下
<!D