开源项目typescript

Leo_wlCnBlogs Leo_wlCnBlogs     2022-08-24     746

关键词:

TypeScript出来有段时间了,也冒出了很多用TypeScript开发的优秀开源项目,搜寻了一些基于TypeScript项目,分享给大家:

https://github.com/brookshi/awesome-typescript-projects 喜欢的朋友请star支持,谢谢。

TypeScript

可能有人奇怪这里说的是基于TypeScript的开源项目,为什么TypeScript本身也在这里。
其实TypeScript语言本身就是用TypeScript编写的,即self-hosting,使用上一稳定版本的编译器来编译本次版本。
TypeScript就不做太多介绍了,不熟悉的同学可以参考我之前写的 C#到TypeScript系列

IDE - VSCode

基于TypeScript + Nodejs + Electron开发的IDE. Github上star: 2万+

VSCode大家应该都知道,同样是微软开发,没使用过的建议试用下,相对于Visual Studio的笨重,VSCode非常轻,占用内存少,打开项目速度快,而且跨平台,非常适合用来做前端或Nodejs开发。
支持的特性也很多,通过扩展能支持非常多的语言,比如C#, GO, C++等,最近发布的包还原生支持Markdown语法,我的文章都是用VSCode写的。
打开大文件真的是秒开,之前用Notepad++打开大文件还有点迟顿,格式化成Json更是直接卡死,VSCode则完全没问题。

其他基于TypeScript的IDE还有: 在线IDE monaco-edit,游戏开发IDE superpowers等,有兴趣的同学可以去awesome typescript projects了解下。

Framework - Angular2

基于TypeScript + RxJS + ZoneJS的Framework. Github上star: 2万+

大名鼎鼎的前端三剑客之一,背后的老爹Google确保了Angular的质量,Angular从Angular2开始采用TypeScript来开发,强类型对框架的稳定性提供不少支持。
微软Azure的页面就是用Angular写的,下面这个也是Angular2的一个dashboard应用。

在Angular2上衍生了不少优秀的框架或库,如 angular-seed,material2, ui-router等。

其他框架还有很多诸如 ionic,NativeScript,AtomicGameEngine的优秀框架都是用TypeScript开发的,国内的白鹭引擎(egret)同样基于TypeScript。

UI - ant-design

基于TypeScript + React的UI界面库. Github上star: 1万+

ant-design是由国内阿里旗下的蚂蚁金服的团队用TypeScript开发的一款企业级React UI库,已经应用到金服和其他阿里旗下产品当中。
ant-design的UI看起来非常美观,而且不显累赘,文档也非常完整,重点是文档是中文版的,相信非常适合国内开发使用。

ant-design也推出了mobile版ant-design-mobile,这样不管是web端还是移动端都可以有同一套UI设定。

同样基于TypeScript的UI库还有不少,如Angular的material2,和ant-design有一拼的blueprint都是其中佼佼者。

library - ui-router

基于TypeScript + Angular的UI router库. Github上star: 1万+

ui-router的目的是提供一个管理UI跳转的库,基于状态机维护了一个层级的状态树,这个库对于单页应用来说非常有用。
现在应用页面非常多,如果没有一个管理中心的话,不停的跳转后状态很容易乱掉,这个库就是用来解决这个问题。

下图最底下的那条就是页面的路由,在微软的Azure上也有用到。

library - RxJS

这个库现在出到5代,之前是用JavaScript开发,5代开始采用TypeScript开发。 Github上star: 5千+

当然第四代是很出名的,Github已经有超过1万的star。
这个库算是响应式编程库家庭中的一员,其他还有RxJava,Rx.NET,RxGO等。

RxJS是基于流的概念,提供了一系列神奇的函数工具集,使用它们可以合并、创建、过滤这些流。
一个流或者多个流可以作为另一个流的输入。比如你可以合并多个流,或者从很多流中选出你需要的,还可以将值从一个流映射到另一个流。
这种方式对于事件的处理会非常方便,具体可以去github上查看相关文档。

tool - tslint

做JavaScript开发的有ESLint来规范代码,而TypeScript则可以用TSLint。 Github上star: 1千+

开发一个项目往往有好几个甚至十几人,不同的人不同的代码风格,这时就需要一款工具来规范一下代码,来提高代码质量和可维护性。
基本上上面写的项目都有用到这款工具,可见其流行程度。

总结

上面从IDE, Framework, UI, 库,工具等方面分别介绍了一些TypeScript的流行开源项目,其它还有很多有潜力的项目如Nodejs的ORM框架:TypeORM等,大家可以去awesome typescript projects翻翻。
这些都说明TypeScript已经非常成熟,稳定了,而且上面项目有一些是从JavaScript转过来的重新打造的项目,由此可以说明TypeScript确实可以给项目带来实实在在的好处。
TypeScript的发展还在继续,做为微软走向开源的一个标志性项目,有理由相信TypeScript将来会有很好的发展。

js加强篇!推荐10个好用的typescript的开源项目yyds!

...itHub上能挖矿的神仙技巧-如何发现优秀开源项目1.reactReactTypeScript备忘单。为经验丰富的React开发人员准备的TypeScript入门备忘单https://github.com/typescript 查看详情

初识typescript(代码片段)

什么是typescript?Typescript是一种由微软开发的自由和开源的语言,是原生javascript的超集,Typescript在原生javascript的基础上添加了可选的静态类型和基于类的面向对象编程.可是尽管如此,Typescript在编译时还是需要将其转化成javascript.其... 查看详情

typescript前端工程最佳实践

 作者:王春雨前言随着前端工程化的快速发展,TypeScript变得越来越受欢迎,它已经成为前端开发人员必备技能。TypeScript最初是由微软开发并开源的一种编程语言,自2012年10月发布首个公开版本以来,它已得到了人们的广泛... 查看详情

typescript从零开发视频播放器(代码片段)

typescript从零开发视频播放器前言项目架构设计技术栈双端支持元素的显示和隐藏说明组件化开发组件之间的通讯拖拽行为初始化模板video标签组件控制器的显示和隐藏显示时间全屏进度条显示/隐藏loading快捷键其他组件开发国际... 查看详情

typescript从零开发视频播放器(代码片段)

typescript从零开发视频播放器前言项目架构设计技术栈双端支持元素的显示和隐藏说明组件化开发组件之间的通讯拖拽行为初始化模板video标签组件控制器的显示和隐藏显示时间全屏进度条显示/隐藏loading快捷键其他组件开发国际... 查看详情

推荐9个yyds前后端分离项目

...目是:1.前后端分离博客系统2.前后端分离考试系统3.基于TypeScript的聊天室项目4.人力资源管理开源项目5.一个可以用来练手的前后端分离项目6.学之思开源考试系统7.前后端分离的后台管理系统8.前后端管理平台一站式脚手架9.一... 查看详情

typescript@helloworld!(代码片段)

一、TypeScript是什么呢?TypeScript是由微软开发的开源编程语言,是JavaScript的超集语言,编译后生成js文件。TypeScript在JavaScript的基础上添加了一些好用的语法糖,可选的静态类型和基于类的面向对象编程。二、搭建开发环境1、搭... 查看详情

TypeScript 项目的目录结构

】TypeScript项目的目录结构【英文标题】:DirectorystructureforTypeScriptprojects【发布时间】:2016-06-1814:47:48【问题描述】:TypeScript项目的惯用目录结构是什么?我希望这种结构具有以下功能:TypeScript源代码和转译的JavaScript的单独目... 查看详情

基于typescript的无头内容管理系统“payload”现已开源

导读开源的无头内容管理系统(CMS)列表中添加了一个新选项。它会是一个更好的无头WordPress替代品吗?自从一年多前发布首个测试版以来,作为无头内容管理系统(CMS),Payload已经逐渐在Web开发社区... 查看详情

带有引用的 TypeScript 项目

】带有引用的TypeScript项目【英文标题】:TypeScriptprojectwithreferences【发布时间】:2019-08-0214:01:43【问题描述】:我使用projectreferences来引用“前”和“后”项目中的“共享”项目。tsc-v:Version3.3.3项目结构:./MY_PROJECT.code-workspace/*the... 查看详情

vscodefeaturerequest第一次打开typescript文件自动折叠tsdoc注释

本人在VSCode提了一个第一次打开TypeScript文件自动折叠tsdoc注释的FeatureRequest如果喜欢这个Feature的请到↪openTypeScriptfile,theDoccommentdefaultbefolder去点个赞随便去了解一下大型开源项目的IssuesTriaging也是不错的 查看详情

vue+typescript+vuex创建项目

首先安装Vue脚手架npmi-g@vue/cli创建Vue项目vuecreate项目名安装vue/TypeScriptvueadd@vue/typescript安装vuexnpmivuex  安装vueadd@vue/typescript时一定要进入项目目录下面才能安装成功,否则会报错,找不到package.json文件 查看详情

Typescript 本地依赖项(多个项目)

】Typescript本地依赖项(多个项目)【英文标题】:Typescriptlocaldependencies(MultipleProjects)【发布时间】:2017-09-2123:40:09【问题描述】:我是打字稿的新手。我目前正在尝试创建一个相互依赖的项目结构。共有三个项目core、calculator和... 查看详情

推荐10个vue3.0开发的开源前端项目

...左右,打包后的体积也更小了,同时Vue3.0还提供了更好的TypeScript支 查看详情

typescript解决方案“错误:gulp-typescript:项目不能同时用于两个编译*。使用createp创建多个项目(代码片段)

查看详情

React/Typescript:选定项目计数器逻辑

】React/Typescript:选定项目计数器逻辑【英文标题】:React/Typescript:Selecteditemscounterlogic【发布时间】:2021-07-1317:22:27【问题描述】:我一直在尝试创建一个带有计数器的选择列表。目标是能够选择尽可能多的项目,并有一个小标... 查看详情

如何在vue项目中使用typescript(代码片段)

0.前言本快速入门指南将会教你如何在Vue项目中使用TypeScript进行开发。本指南非常灵活,它可以将TypeScript集成到现有的Vue项目中任何一个阶段。1.初始化项目首先,创建一个新的项目目录。mkdirtypescript-vue-tutorialcdtypescript-vue-tutori... 查看详情

VueJS 项目和 TypeScript 中的范围错误

】VueJS项目和TypeScript中的范围错误【英文标题】:ErrorofscopeinVueJSproject&TypeScript【发布时间】:2021-04-2903:06:16【问题描述】:我在一个带有TypeScript的VueJS项目中出现错误,我的vue文件被拆分为HTML、CSS、TS和vue。我有这个错误:... 查看详情