Civet

Civet

TypeScript超集语言 简洁高效的编程新选择

Civet作为TypeScript超集,引入了模式匹配、管道操作符等新语法特性,并对JSX和TypeScript进行了增强。它能与Node.js环境无缝集成,且提供VSCode插件支持。Civet致力于简化开发流程,推动TypeScript编程向更高效的方向发展。

CivetTypeScript编程语言代码转译开发工具Github开源项目

Civet

构建状态 NPM 版本 NPM 下载量 覆盖率状态 Discord Open Collective

编写 TypeScript 的现代方式。

快速入门指南

# 安装 npm install -g @danielx/civet # 在 REPL 中直接运行 Civet 代码 civet # 在 REPL 中将带类型的 Civet 代码转译为 TypeScript civet -c # 将 Civet 源文件编译为 TypeScript civet < source.civet > output.ts # 执行 .civet 脚本 civet source.civet ...args... # 在 node 中执行 .civet 源文件 node --import @danielx/civet/register source.civet

image

代码示例

ts, {CompilerOptions} from typescript DefaultCompilerOptions : CompilerOptions := allowNonTsExtensions: true allowJs: true target: ts.ScriptTarget.Latest moduleResolution: ts.ModuleResolutionKind.NodeJs module: ts.ModuleKind.CommonJS allowSyntheticDefaultImports: true experimentalDecorators: true fileCache : Record<string, any> := {} createCompilerHost := (options: CompilerOptions, moduleSearchLocations : string[]) -> fileExists := (fileName: string) : boolean -> fileCache[fileName]? readFile := (fileName: string) -> fileCache[fileName]

概述

Civet 本质上是 TypeScript 的一个优雅的超集。

新的和提议中的 ES 特性的实现

请查看文档以了解这些和其他特性的示例。

  • 模式匹配(基于 TC39 提案
    • switch 可以匹配如 [{type: "text", name}, ...rest] 这样的模式
  • 管道操作符(基于 F# 管道Hack 管道TC39 提案
    • data |> Object.keys |> console.log 等同于 console.log(Object.keys(data))
    • 使用单参数箭头函数或 & 简写来指定如何使用左侧值
    • |> await|> yield|> return(在末尾) 用于包装左侧值的操作
  • 简短函数块语法,类似于 Ruby symbol to procCrystalElm 记录访问
    • 访问:x.map &.namex.map .namex.map(a => a.name)
    • 嵌套访问 + 切片:x.map &.profile?.name[0...3]x.map(a => a.profile?.name.slice(0, 3))
    • 函数调用:x.map &.callback a, bx.map($ => $.callback(a, b))
    • 一元运算符:x.map !!&x.map($ => !!$)
    • 二元运算符:x.map &+1x.map($ => $+1)
  • 对象字面量简写
    • {foo()}{foo: foo()}{props.foo}{foo: props.foo}
    • {`${x}${y}`: z}{[`${x}${y}`]: z}
    • data.{x,y}data{x,y}{x: data.x, y: data.y}
    • 基于 LiveScript 的标记简写: {+debug, -live, !verbose}{debug: true, live: false, verbose: false}
  • 任意双参数函数的自定义中缀运算符
  • do 表达式、if 表达式、for 表达式

ES6+ 特性的便利性

  • 常量赋值简写:a := bconst a = b{a, b} := cconst {a, b} = c
  • let 赋值简写:a .= blet a = b
  • 上述的类型版本:a: number .= 5let a: number = 5 (注意 a: number = 5 是对象字面量 {a: (number = 5)}
  • @#idthis.#id 用于私有标识符的简写
  • import 简写:x from ./ximport x from "./x"
  • 动态 import 简写:非顶层的 import './x' (如 await import './x' 或函数内部)→ import('./x')
  • 可选的 import 重命名语法,对应于解构重命名 import {x: y} from "./z"import {x as y} from "./z"。你仍然可以 使用 as 以兼容现有的 ES 导入。
  • export 简写:export x, yexport {x, y}
  • 三重反引号模板字符串移除前导缩进以提高清晰度
  • 类构造函数简写 @( ... )
  • 类静态块 @ { ... }
  • < 作为 extends 的简写
  • /// 块正则表达式 类似 Python re.X

JSX 增强

solid-dsl 讨论jsx spec 问题 的启发

  • 缩进:无需显式关闭 <tag><>, 你可以缩进子元素,Civet 将自动为你关闭标签
  • 多个相邻元素和/或片段会自动 组合成一个片段。
  • 箭头函数子元素不需要用大括号包裹 (假设它们前面没有文本);这是明确的,因为 > 不是有效的 JSX 文本。例如,<For> (item) => ... (函数体可以缩进)。
  • #fooid="foo" 的简写; 还有 #"foo bar"#`foo ${bar}`#{expr}
  • .fooclass="foo" 的简写(但必须在标签名后至少一个空格); 还有 .foo.bar."foo bar".`foo ${bar}`.{expr}
    • "civet react" 标志使用 className 而不是 class
  • +foofoo={true} 的简写,-foo/!foofoo={false} 的简写
  • 任何大括号对象字面量都可以用作属性: {foo}foo={foo}{foo: bar}foo={bar}{...foo} 保持不变;方法和 getter/setter 也可以工作。
  • 属性 ...foo{...foo} 的简写
  • 没有空格或适当包装的属性值 (括号表达式、字符串和模板字符串、 正则表达式、数组字面量、大括号对象字面量) 不需要大括号: foo=barfoo={bar}count=count()count={count()}sum=x+1sum={x+1}list=[1, 2, 3]list={[1, 2, 3]}
  • 属性可以使用计算属性名: [expr]={value}{...{[expr]: value}}
  • "civet solid" 标志为 JSX 元素和片段添加正确的类型。 使用 "civet solid client"(默认)用于仅客户端代码, "civet solid server" 用于仅服务器代码(仅 SSR),或 "civet solid client server" 用于在客户端和服务器上运行的同构代码(SSR + 水合)。
  • XML 注释:<!-- ... -->{/* ... */}

TypeScript 增强

ES6 的变更

  • 即使对于多语句函数,也支持隐式返回 (可以通过指定 void 返回类型、添加尾随 ; 或显式 return,或通过指令 "civet -implicitReturns" 来避免)
  • 不允许单参数箭头函数省略括号。x => ... 必须改为 (x) => ... 原因是在 CoffeeScript 中 x -> ... 等同于 x(function() ...),让 ->=> 的行为差异更大是不好的。不带括号地将匿名函数传递给应用程序也很方便。
  • for(i of x) ... 默认为 const 声明 → for(const i of x) ...
  • 在条件语句和许多其他地方禁用逗号运算符。不允许 if x, y。但允许 for i = 0, l = a.length; i < l; i++, i *= 2
  • case/when 中的逗号运算符变成多个条件。
  • 数字不能以点结尾(否则会与 CoffeeScript 的切片 y[0..x] 产生歧义)。这也意味着你不能用 1..toString() 来访问数字的属性,应该使用 1.toString()。当指数跟在点后面时,它被视为属性访问,因为指数可能是一个有效的属性 1.e101..e10。解决方法是添加一个尾随零 1.0e10 或删除指数前的点 1e10
  • 额外的保留字 andorloopuntilunless
  • 实验性装饰器语法是 @@ 而不是 @,因为 @ 是高价值符号,@idthis.id,而且 @ 也用于静态字段/方法等。
    @@classDecorator
    class X
      @@methodDecorator
      method() {}
    
  • switch 内的 when 自动中断并添加块级作用域。
  • switch 内的 else 添加块级作用域。
  • 一元运算符和操作数之间没有空格。条件和三元 ? 之间必须有空格,例如 x ? a : b,因为 x? 是一元存在运算符。
  • 标签写作 :label(除了 Svelte 的特殊情况 $:

脚本改进

  • Shebang 行在输出中保持不变
    #!./node_modules/.bin/ts-node console.log "hi"

与 CoffeeScript 的比较

请查看这个详细的 Civet // CoffeeScript 比较

指令

Civet 不仅仅是一种语言;它可以通过指令以多种方式进行配置,以添加或删除语言特性,或在某些环境中改善行为。 请参阅配置文档

在 Node.js 环境中使用 Civet

现在你已经确信 Civet 适合你当前/下一个项目。以下是如何设置你的环境以立即提高生产力并获得良好体验。

测试

由于 c8 的源映射集成和 Civet 的源映射,代码覆盖率测试"开箱即用"。

c8 + Mocha

package.json

"scripts": { "test": "c8 mocha", ... }, "c8": { "extension": [ ".civet" ] }, "mocha": { "extension": [ "civet" ], "loader": [ "@danielx/civet/esm" ], ... ...

如果你不关心代码覆盖率,可以跳过 c8(但它如此简单,为什么不保留呢?)。

你也可以添加 .js.ts 扩展名,如果你想混合使用的话!如果你 require coffeescript/register 或为它添加一个加载器,甚至 .coffee 也可以工作。

执行测试

yarn test

第 4 步:尽情享受!

开发

使用 Civet Language Server 的 alpha 版本

语言服务器提供语法高亮、自动完成、悬停文档、符号大纲、红色波浪线和转到定义功能。


问: 为什么我不能直接使用 VSCode 内置的 TypeScript LSP?

答: VSCode 内置的 TypeScript LSP 无法解析非 .ts/.js 文件,即使使用插件也不行。也许有一天他们会允许使用插件来调整解析器并插入转译步骤,但在那之前,需要一个单独的语言服务器。


问: 有时文件大纲消失了,红色波浪线都在错误的位置,可能还会弹出一个关于某种 LSP 错误的通知。

答: 我很抱歉发生这种情况,但 Civet Language Server 仍处于 alpha 阶段,正在快速改进。请告诉我具体发生了什么,我会尽力在下次做得更好。

这可能发生在你的 Civet 文件中存在语法错误时。你可以使用 CLI 工具检查它是否能编译。

请提交错误报告/功能请求。

构建

我强烈推荐使用 esbuild 来构建/打包你的 Civet 项目。

import esbuild from 'esbuild' import civetPlugin from '@danielx/civet/esbuild-plugin' esbuild.build({ ..., plugins: [ civetPlugin ] }).catch(() => process.exit(1))

它非常快速,效果很好!

代码覆盖率

Coverage Status

赞助

如果你愿意,你可以在 Open Collective 上赞助 Civet。

编辑推荐精选

蛙蛙写作

蛙蛙写作

AI小说写作助手,一站式润色、改写、扩写

蛙蛙写作—国内先进的AI写作平台,涵盖小说、学术、社交媒体等多场景。提供续写、改写、润色等功能,助力创作者高效优化写作流程。界面简洁,功能全面,适合各类写作者提升内容品质和工作效率。

AI助手AI工具AI写作工具AI辅助写作蛙蛙写作学术助手办公助手营销助手
Trae

Trae

字节跳动发布的AI编程神器IDE

Trae是一种自适应的集成开发环境(IDE),通过自动化和多元协作改变开发流程。利用Trae,团队能够更快速、精确地编写和部署代码,从而提高编程效率和项目交付速度。Trae具备上下文感知和代码自动完成功能,是提升开发效率的理想工具。

热门AI工具生产力协作转型TraeAI IDE
问小白

问小白

全能AI智能助手,随时解答生活与工作的多样问题

问小白,由元石科技研发的AI智能助手,快速准确地解答各种生活和工作问题,包括但不限于搜索、规划和社交互动,帮助用户在日常生活中提高效率,轻松管理个人事务。

聊天机器人AI助手热门AI工具AI对话
Transly

Transly

实时语音翻译/同声传译工具

Transly是一个多场景的AI大语言模型驱动的同声传译、专业翻译助手,它拥有超精准的音频识别翻译能力,几乎零延迟的使用体验和支持多国语言可以让你带它走遍全球,无论你是留学生、商务人士、韩剧美剧爱好者,还是出国游玩、多国会议、跨国追星等等,都可以满足你所有需要同传的场景需求,线上线下通用,扫除语言障碍,让全世界的语言交流不再有国界。

讯飞智文

讯飞智文

一键生成PPT和Word,让学习生活更轻松

讯飞智文是一个利用 AI 技术的项目,能够帮助用户生成 PPT 以及各类文档。无论是商业领域的市场分析报告、年度目标制定,还是学生群体的职业生涯规划、实习避坑指南,亦或是活动策划、旅游攻略等内容,它都能提供支持,帮助用户精准表达,轻松呈现各种信息。

热门AI工具AI办公办公工具讯飞智文AI在线生成PPTAI撰写助手多语种文档生成AI自动配图
讯飞星火

讯飞星火

深度推理能力全新升级,全面对标OpenAI o1

科大讯飞的星火大模型,支持语言理解、知识问答和文本创作等多功能,适用于多种文件和业务场景,提升办公和日常生活的效率。讯飞星火是一个提供丰富智能服务的平台,涵盖科技资讯、图像创作、写作辅助、编程解答、科研文献解读等功能,能为不同需求的用户提供便捷高效的帮助,助力用户轻松获取信息、解决问题,满足多样化使用场景。

模型训练热门AI工具内容创作智能问答AI开发讯飞星火大模型多语种支持智慧生活
Spark-TTS

Spark-TTS

一种基于大语言模型的高效单流解耦语音令牌文本到语音合成模型

Spark-TTS 是一个基于 PyTorch 的开源文本到语音合成项目,由多个知名机构联合参与。该项目提供了高效的 LLM(大语言模型)驱动的语音合成方案,支持语音克隆和语音创建功能,可通过命令行界面(CLI)和 Web UI 两种方式使用。用户可以根据需求调整语音的性别、音高、速度等参数,生成高质量的语音。该项目适用于多种场景,如有声读物制作、智能语音助手开发等。

咔片PPT

咔片PPT

AI助力,做PPT更简单!

咔片是一款轻量化在线演示设计工具,借助 AI 技术,实现从内容生成到智能设计的一站式 PPT 制作服务。支持多种文档格式导入生成 PPT,提供海量模板、智能美化、素材替换等功能,适用于销售、教师、学生等各类人群,能高效制作出高品质 PPT,满足不同场景演示需求。

讯飞绘文

讯飞绘文

选题、配图、成文,一站式创作,让内容运营更高效

讯飞绘文,一个AI集成平台,支持写作、选题、配图、排版和发布。高效生成适用于各类媒体的定制内容,加速品牌传播,提升内容营销效果。

AI助手热门AI工具AI创作AI辅助写作讯飞绘文内容运营个性化文章多平台分发
材料星

材料星

专业的AI公文写作平台,公文写作神器

AI 材料星,专业的 AI 公文写作辅助平台,为体制内工作人员提供高效的公文写作解决方案。拥有海量公文文库、9 大核心 AI 功能,支持 30 + 文稿类型生成,助力快速完成领导讲话、工作总结、述职报告等材料,提升办公效率,是体制打工人的得力写作神器。

下拉加载更多