使用Vue.js编写命令行界面，前端开发的强大工具CLIRenderVuetocommand-linetools:)。命令行工具大家应该都不陌生，比如vue-cli、Vite等。我们在为用户编写前端应用的时候，通常会非常注重用户体验。作为开发者，我们在使用工具的时候，也会非常关注它给我们带来的开发者体验（DX）。团队今年有自主研发的脚手架计划。作为前端，想知道有没有一种成本更低的研发方案，可以让团队的小伙伴都参与进来，大家可以像写前端应用一样搞定。因此，铁米尔[3]应运而生。Temir引入了Temir[4]，这是一个使用Vue组件编写命令行界面应用程序的工具。仅限开发人员可以使用Vue编写命令行应用程序，无需任何额外的学习成本。{{counter}}testspassed复制代码组件Temir[5]提供了一些基本的组件来帮助开发者编写和扩展命令行工具：文本组件（Text）文本组件可以显示文本并将其样式更改为粗体、下划线、斜体或删除线。我是绿色我是白底黑字我是白字我是粗体我是斜体我是下划线我是删除线我是反线复制代码盒子组件(Box)是构建布局必不可少的铁木尔组件.就像浏览器中的一样。它提供了构建布局的一些通用属性，例如大小、内外边距、对齐方式等。X//[X]X//[X]X//[X]XY//[XY]??XY//[XY]复制代码换行组件（Newline）添加一个或多个换行符（\n）必须在组件中使用。你好World复制代码以填充组件（Spacer）沿其包含布局的主轴扩展的灵活空间。它作为填充元素之间所有可用空间的快捷方式很有用。例如，在具有默认弯曲方向（行）的内使用会将“Left”定位到左侧并将“Right”推到右侧。LeftRight复制代码超链接组(Link)嗨Github复制代码加载中间件(Spinner)Loading复制代码标签页面组件（Tab）选定文本：{{selectedText}}activeIndex=+index">{{item}}复制代码选择组件复制代码安装npminstall@temir/core使用{{counter}}测试通过复制代码HMR支持我们之前提到了开发者体验（DX）。在目前的前端工程中，HMR对开发者的帮助很大，效率也很高。铁米尔[6]这么香的东西，没有理由不拥有。直接展示：开箱即用Temir[7]自定义CLI非常简单，我们提供\@temir/cli[8]帮助您快速搭建基于Temir[9]的CLI.mkdirmy-temir-clidmy-temir-clitouchmain.tsnpminstall@temir/cl#Dev(开发)temirmain.ts#Build(打包)temirbuildmain.ts复制代码你可以下载这个例子[10]快速上手，你可以也打开repl。itsandbox[11]体验并在线演示HiTemir[12]Borders[13]Table[14]Vitest[15]实现createRendererTemir主要得益于Vue3出色的跨平台能力，我们可以使用createRenderer[16]创建自定义渲染器的API，通过在宿主环境中创建对应的Node和Element，对元素进行增删改查。YogaVue提供了在命令行界面上运行的接口，所以我们还缺少一个布局引擎来在命令行上运行Vue。Temir使用Yoga，一种Flexbox布局引擎。使用您在构建浏览器应用程序时使用的类似CSS的属性来为您的CLI构建出色的用户界面。致谢本项目的灵感来源于ink[17]vite-node[18]，为HMR的实现提供了强有力的支持。star[19]支持作者?
