使用多语言开发插件CodeMix和Angular IDE的TypeScript支持,简单有效地扩展开发

翻译|使用教程|编辑:陈津勇|2019-12-31 15:00:42.913|阅读 111 次

概述:本文详细介绍了使用CodeMix和Angular IDE的TypeScipt支持开发TypeScipt项目的相关内容。如果您使用的是MyEclipse,可以免费安装CodeMix并使用最新的TypeScipt支持(CodeMix也包含Angular IDE)。

# 您正在找协同办公软件吗?点击这里站长给您推荐 #

TypeScript是JavaScript的类型化超集,可编译为纯JavaScript。它是为开发大型应用程序设计的,非常适合企业发展。

本文详细介绍使用CodeMix和Angular IDE的TypeScipt支持进行开发的相关内容。如果您使用的是MyEclipse,建议将CodeMix添加到安装中以获得最新的TypeScript支持。
提示:企业级Java EE开发工具MyEclipse正版授权可免费使用CodeMix多语言开发扩展插件。

优惠购买CodeMix授权 优惠购买MyEclipse授权


什么是TypeScript?

TypeScript是JavaScript的类型化超集,提供类、接口、泛型甚至模块和名称空间之类的构造,可帮助您编写可维护的代码。
通过TypeScript可使用最新的JavaScript功能(包括ECMAScript 2015甚至未来的建议)编写代码,将其编译为可在任何浏览器,Node.js或任何支持ECMAScript 3的JavaScript引擎中运行JavaScript代码。这使您可以使用最新的开发框架和技术,而无需客户拥有最新的浏览器或相关技术。
除了使用最新的JavaScript技术之外,TypeScript是类型化这一特性还提供了出色的内容辅助、重构和最终验证。这些好处甚至可以扩展到现有的JavaScript框架中-您可以使用现有的JavaScript代码、合并流行的JavaScript库,并从JavaScript调用TypeScript代码。
TypeScript项目
要创建TypeScript项目,请转到File > New > Project > CodeMix > TypeScript Project,输入项目名称,然后单击“Finish”。

创建项目时请保持启用NPM和节点版本管理复选框处于选中状态,以确保在Terminal +中使用命令行时具有固定版本的Node和NPM。Project Properties>CLI Tool Management中配置这些版本。
此向导创建一个示例TypeScript项目(包括示例tsconfig.json和package.json配置文件),或在Eclipse项目的根目录中手动创建tsconfig.json文件,以将该项目识别为TypeScript项目。
注意:任何包含tsconfig.json文件的目录都将使该目录成为TypeScript项目的根目录。这使您可以在单个Eclipse项目中定义多个TypeScript项目。

在没有tsconfig.json文件的情况下,TypeScript文件被视为独立的单元,但如果您确实要处理多个TypeScript文件,不建议使用此模式。

CodeMix安装教程

tsconfig.json
通常在此文件中配置的两个主要部分是编译器选项,以及要从项目配置中包含或排除的源文件。使用IntelliSense(Ctrl+Space)可帮助您指定其他参数。
注意:TypeScript的设置在tsconfig中有描述。没有可在其上配置这些设置的其他属性或首选项页面。
创建TypeScript文件
要创建新的TypeScript源文件,请选择File > New > Other > CodeMix > TypeScript File,然后使用向导将新文件添加到项目中。
编辑TypeScript源
CodeMix提供内置的IntelliSense来改善编码体验。
内容辅助
在输入时显示内容帮助建议,不需要手动调用帮助,也可以使用Ctrl+Space查看建议。当您使用建议插入尚未导入的类时,导入也会被添加。
当您输入方法的参数时,“文档”弹出窗口会提供可用的文档,包括参数信息的显示。
Peek Definition
将Ctrl鼠标悬停在某个字段或方法上时可以按此键查看定义,而无需更改编辑上下文。

Snippets
Snippets减少了编写通用代码甚至在某些情况下的样板代码所需的时间。这些片段包含占位符,可轻松自定义生成的代码。

快速修复
多个错误或警告可以快速修复问题,您可以单击“灯泡”或按Ctrl+1来自动修复这些问题。对于某些问题,您可以选择通过单击修复项目中的所有类似问题,或者禁用导致警告的规则。
重构
按Alt+Shift+R,或从上下文菜单调用“Rename”,以为TypeScript源代码中的符号调用重命名重构。

您还可以执行其他重构,例如将代码提取到方法、常量等。选择要提取的源代码并按Ctrl+Shift+P,然后选择“Refactor”查看可用的重构。
在命令面板中,您甚至可以通过对导入进行排序并删除未使用的导入来组织导入。
大纲和导航
大纲视图显示TypeScript源代码的大纲:双击视图中的条目导航到相应的符号。您还可以通过按Ctrl+O来访问快速大纲。您现在可以开始键入以筛选显示的节点并快速跳转到一个符号。

超链接导航使您可以在文件之间或文件中跳转。将鼠标悬停在源代码上时,按Ctrl键激活超链接,单击可导航到源代码中的该位置。您还可以按F3或使用上下文菜单“Go to Definition”操作。
格式化和保存操作
按Ctrl+Shift+F或上下文菜单“Format”操作来格式化TypeScript源。要配置格式化程序,请转到Preferences > CodeMix > Settings > User Settings,然后在过滤器中键入typescript.format。根据需要调整设置。

在保存时可能需要执行一些操作。在同一设置页面上,您可以根据需要修改以下设置:

  • editor.formatOnSave
  • tslint.autoFixOnSave
  • typescriptHero.imports.organizeOnSave
构建和验证
用TSLint整理
有了对TSLint的内置支持,只需在tslint.json文件中配置linting设置,编辑器将开始显示linting错误。TSLint报告的许多错误可以使用快速修复功能自动修复。
TypeScript语言验证和翻译
通过高级构建管道支持,TypeScript文件可通过IDE中的语言智能和外部tsc编译器(如果您选择的话)进行验证。tsc也可以用于将TypeScript转换为JavaScript。




想进一步了解MyEclipse/CodeMix?【MyEclipse官方中文网】知你所需,解你所惑!
想与更多人聊MyEclipse/CodeMix?加入MyEclipse中国(官方2):742336981畅所欲言吧!
想及时获取MyEclipse/CodeMix资讯?扫描下方二维码,最新信息跟你走!


标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果

文章转载自:Genuitec https://www.genuitec.com/docs/web-apps/modern-web/using-typescript/

登录 慧都网发表评论


暂无评论...

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
相关厂商
相关产品
CodeMix

CodeMix基于Eclipse的IDE开发多语言和Code OSS构建的附加扩展。

MyEclipse

功能最全面、性价比最高的Java IDE之一

在线
客服
在线
QQ
咨询
电话
173-8239-2642
购物车 反馈 返回
顶部
在线客服系统
live chat