宣布 Electron 中支持 TypeScript
electron
npm 软件包现在包含一个 TypeScript 定义文件,该文件提供了整个 Electron API 的详细注释。即使你编写的是原生 JavaScript,这些注解也可以提升你的 Electron 开发体验。只需安装 npm install electron
,即可在你的项目中获取最新的 Electron 类型。
¥The electron
npm package now includes a TypeScript definition file that provides detailed annotations of the entire Electron API. These annotations can improve your Electron development
experience even if you're writing vanilla JavaScript. Just
npm install electron
to get up-to-date Electron typings in your project.
TypeScript 是由微软创建的一种开源编程语言。它是 JavaScript 的一个超集,通过添加对静态类型的支持来扩展 JavaScript 语言。TypeScript 社区近年来发展迅速,在最近的 Stack Overflow 开发者调查中,TypeScript 跻身 最受欢迎的编程语言 之列。TypeScript 被描述为 "可扩展的 JavaScript",GitHub、Slack 和 微软 的团队都在使用它来编写可扩展的 Electron 应用,这些应用的用户多达数百万。
¥TypeScript is an open-source programming language created by Microsoft. It's a superset of JavaScript that extends the language by adding support for static types. The TypeScript community has grown quickly in recent years, and TypeScript was ranked among the most loved programming languages in a recent Stack Overflow developer survey. TypeScript is described as "JavaScript that scales", and teams at GitHub, Slack, and Microsoft are all using it to write scalable Electron apps that are used by millions of people.
TypeScript 支持 JavaScript 中的许多较新的语言特性,例如类、对象解构和 async/await,但其真正的区别在于类型注解。声明程序所需的输入和输出数据类型可以帮助你在编译时发现错误,而注解也可以作为正式的声明。
¥TypeScript supports many of the newer language features in JavaScript like classes, object destructuring, and async/await, but its real differentiating feature is type annotations. Declaring the input and output datatypes expected by your program can reduce bugs by helping you find errors at compile time, and the annotations can also serve as a formal declaration of how your program works.
当库是用原生 JavaScript 编写时,类型通常是在编写文档时事后才模糊地定义的。函数通常可以接受比文档中更多的类型,或者函数可能存在未记录的不可见约束,这可能导致运行时错误。
¥When libraries are written in vanilla Javascript, the types are often vaguely defined as an afterthought when writing documentation. Functions can often accept more types than what was documented, or a function can have invisible constraints that are not documented, which can lead to runtime errors.
TypeScript 使用定义文件解决了这个问题。TypeScript 定义文件描述了库的所有函数及其预期的输入和输出类型。当库作者将 TypeScript 定义文件与其发布的库打包在一起时,该库的使用者可以立即 直接在内部探索其 API 编辑器 并开始使用它,通常无需查阅库的文档。
¥TypeScript solves this problem with definition files. A TypeScript definition file describes all the functions of a library and its expected input and output types. When library authors bundle a TypeScript definition file with their published library, consumers of that library can explore its API right inside their editor and start using it right away, often without needing to consult the library's documentation.
许多热门项目,例如 Angular、Vue.js、node-github(现在还有 Electron!),都编译了自己的定义文件,并将其与已发布的 npm 包打包在一起。对于未打包自身定义文件的项目,可以使用 DefinitelyTyped,这是一个由社区维护的定义文件的第三方生态系统。
¥Many popular projects like Angular, Vue.js, node-github (and now Electron!) compile their own definition file and bundle it with their published npm package. For projects that don't bundle their own definition file, there is DefinitelyTyped, a third-party ecosystem of community-maintained definition files.
安装
¥Installation
从 1.6.10 版本开始,每个 Electron 版本都包含自己的 TypeScript 定义文件。当你从 npm 安装 electron
包时,electron.d.ts
文件会自动与已安装的包打包在一起。
¥Starting at version 1.6.10, every release of Electron includes its own
TypeScript definition file. When you install the electron
package from npm,
the electron.d.ts
file is bundled automatically with the
installed package.
用于安装 Electron 的 最安全的方式 使用确切的版本号:
¥The safest way to install Electron is using an exact version number:
npm install electron --save-dev --save-exact
或者,如果你正在使用 yarn:
¥Or if you're using yarn:
yarn add electron --dev --exact
如果你已经在使用 @types/electron
和 @types/node
等第三方定义,你应该将它们从你的 Electron 项目中删除,以防止任何冲突。
¥If you were already using third-party definitions like @types/electron
and @types/node
, you should remove them from your Electron project to prevent
any collisions.
定义文件源自我们的 结构化 API 文档,因此它将始终与 Electron API 文档 保持一致。只需安装 electron
,你将始终获得与你正在使用的 Electron 版本同步的 TypeScript 定义。
¥The definition file is derived from our
structured API documentation,
so it will always be consistent with Electron's API documentation.
Just install electron
and you'll always get TypeScript definitions that are
up to date with the version of Electron you're using.
用法
¥Usage
如需了解如何安装和使用 Electron 新的 TypeScript 注释,请观看此简短的演示截屏视频:
¥For a summary of how to install and use Electron's new TypeScript annotations, watch this short demo screencast:
如果你正在使用 Visual Studio Code,则说明你已经内置了 TypeScript 支持。社区维护的 Atom、Sublime、vim 和 其他编辑器 插件也同样如此。
¥If you're using Visual Studio Code, you've already got TypeScript support built in. There are also community-maintained plugins for Atom, Sublime, vim, and other editors.
一旦你的编辑器配置为 TypeScript,你将开始看到更多上下文感知行为,例如自动补齐建议、内联方法引用、参数检查等等。
¥Once your editor is configured for TypeScript, you'll start to see more context-aware behavior like autocomplete suggestions, inline method reference, argument checking, and more.
TypeScript 入门
¥Getting started with TypeScript
如果你是 TypeScript 新手,并且想要了解更多信息,那么这篇 来自微软的介绍视频 文章会很好地概述这门语言的诞生原因、工作原理、使用方法以及未来发展方向。
¥If you're new to TypeScript and want to learn more, this introductory video from Microsoft provides a nice overview of why the language was created, how it works, how to use it, and where it's headed.
TypeScript 官方网站上也有 handbook 和 playground 模块。
¥There's also a handbook and a playground on the official TypeScript website.
由于 TypeScript 是 JavaScript 的超集,因此你现有的 JavaScript 代码已经是有效的 TypeScript。这意味着你可以逐步将现有的 JavaScript 项目过渡到 TypeScript,并根据需要添加新的语言特性。
¥Because TypeScript is a superset of JavaScript, your existing JavaScript code is already valid TypeScript. This means you can gradually transition an existing JavaScript project to TypeScript, sprinkling in new language features as needed.
致谢
¥Thanks
如果没有 Electron 开源维护者社区的帮助,这个项目是不可能实现的。感谢 Samuel Attard、Felix Rieseberg、Birunthan Mohanathas、Milan Burda、Brendan Forster 以及其他许多开发者修复了错误、改进了文档并提供技术指导。
¥This project would not have been possible without the help of Electron's community of open-source maintainers. Thanks to Samuel Attard, Felix Rieseberg, Birunthan Mohanathas, Milan Burda, Brendan Forster, and many others for their bug fixes, documentation improvements, and technical guidance.
支持
¥Support
如果你在使用 Electron 的新 TypeScript 定义文件时遇到任何问题,请在 electron-typescript-definitions 代码库中提交问题。
¥If you encounter any issues using Electron's new TypeScript definition files, please file an issue on the electron-typescript-definitions repository.
祝你 TypeScript 愉快!
¥Happy TypeScripting!