forked from x/ContextOS
53 lines
4.6 KiB
Plaintext
53 lines
4.6 KiB
Plaintext
title "编辑器"
|
||
spark `作为一个功能完备的工具系统，编辑器当然是必不少的工具。
|
||
web.code.vimer 就是 Contexts 自带的编辑器，具有语法高亮、语法模板、语法补全、语法跳转等功能。
|
||
web.code.vimer 也是一个编辑器框架，默认已经支持 Contexts 用到的语言 Golang、Javascript、HTML、CSS、sh、shy 等，
|
||
如需其它语言，直接添加语法模块即可。Contexts 中所有的工具，都可以被当成插件，在编辑器中直接使用。`
|
||
spark demo vimer
|
||
|
||
chapter "工具界面"
|
||
spark `web.code.vimer 工具，可以在很多地方被使用，不同的地方也会有不同的界面。
|
||
如在笔记中，只需要显示文件内容，所以 web.code.vimer 只会显示工作区的文件内容，其它的工具栏都会隐藏掉。
|
||
如在单独的网页中，web.code.vimer 所有界面都会完整显示，成为一个完整的 IDE。`
|
||
spark `一个完整的界面，有左边的导航区、上面的标题区、中间的工作区、右边的预览区、下面的输出区。
|
||
在左边的导航区，会有各种子栏，如目录列表、空间列表、命令列表、插件列表等，并且可以随时添加新的功能区。点击列表项，即可打开关联的文件，
|
||
在预览区与输出区，是每种语法模块自定义的显示内容。
|
||
如 .html 文件的预览区和输出区，是一个内嵌网页，用来查看网页效果。
|
||
如 .go 文件的预览区和输出区，就是当前代码所开发功能的界面，这样就可以边写代码，边看效果。`
|
||
|
||
chapter "目录与文件"
|
||
section "界面参数"
|
||
spark `web.code.vimer 最核心的功能，当然是展示目录结构与文件内容。所以定义了三个参数 path、file、line。这样 vimer 在使用的地方，就可以通过这三个参数进行控制。
|
||
从而显示指定的目录列表与文件内容。`
|
||
|
||
section "目录列表"
|
||
spark `在左边导航区显示的目录列表，是由参数 path 指定的目录，加上代码仓库管理工具 web.code.git.repos 返回的代码仓库列表。
|
||
vimer 也实现了延时加载，默认只加载当前目录下的文件列表，只有点击仓库才会打开它的目录，才会加载此仓库下的文件列表。`
|
||
|
||
section "项目列表"
|
||
spark `在 Contexts 中，当前空间的所有的代码和文档都保存在 ./src/ 目录下，但有时会用到外部依赖库，并且根据当前的需要，去更改依赖库的代码。
|
||
比如 Contexts 刚开始只有一个代码仓库，后来随着功能不断的增加，不断的拆分出新的代码仓库，现在已经有十几个代码仓库，所以有时为了实现一个新功能，就会修改多个代码仓库。
|
||
为了管理这么多个依赖库，就可以使用 web.code.git.repos 命令，进行统一的上传、下载、提交代码等操作。这些依赖库，分别保存在 ./usr/ 目录下。`
|
||
|
||
chapter "语法与插件"
|
||
spark `vimer 在加载文件内容时，会根据文件的扩展名，自动的加载语法插件。`
|
||
|
||
chapter "预览与输出"
|
||
spark `每种语法的文件，使用方式是不一样的。所以在 vimer 里实现了一种语法引擎的框架，可加载各种语法模块，并分发各种处理事件。
|
||
每种语法模块，都可以定义当前文件的预览区与输出区如何显示。这样就可以一边写代码，一边查看输出的界面。`
|
||
order `
|
||
.shy 的语法模块，就定义了 .shy 的文件预览效果，是生成一个网页来显示文档的效果。
|
||
.go 的语法模块，就会根据文件名，查找出它生成的软件工具，在预览界面中展示此工具。
|
||
.js 的语法模块，也会根据文件名，查找出它关联的后端模块，并在预览界面中展示此工具。
|
||
.html 的语法模块，会直接用文件内容生成一个网页，展示出来。
|
||
`
|
||
|
||
chapter "模块与插件"
|
||
spark `Contexts 是一个工具系统，内置了大量的软件工具。这些工具既要完全独立，又要能和其它所有工具深度配合。这就是为什么 Contexts 要自研前后端框架。`
|
||
spark `Contexts 中的所有前端、后端的各种工具，都可以直接在编辑器中使用。但为了更好的和编辑配合起来，实现更高效的互动，在编辑器的代码添加了很多框架性的功能。
|
||
如编译时 vimer 调用编译工具 web.code.compile 执行编译后，有时会生成一些错误提示信息，这时 vimer 就会根据这些信息实现跳转的功能。
|
||
`
|
||
|
||
chapter "分屏与按键"
|
||
spark `vim 是一个非常高效且强大的编辑器，所以 Contexts 为了致敬 vim，便将自己的编辑器命名为 vimer，很多编辑器的操作，都是借鉴了 vim 的习惯。`
|