当前位置: 代码迷 >> 综合 >> typeScript的介绍、安装、开发工具
  详细解决方案

typeScript的介绍、安装、开发工具

热度:63   发布时间:2023-11-22 13:22:15.0

typeScript的介绍

  1. TypeScript 是由微软开发的开源编程语言

  2. TypeScript是javaScript 的超集,遵循最新的ES6、ES5规范。TypeScript扩展了javaScript的语法。

  3. TypeScript更像后端JAVA、C#这样的面向对象语言,可以让js开发大型企业项目。

  4. 谷歌也在大力支持TypeScript 的推广,谷歌的angular2.x+就是基于TypeScript语法。

  5. 最新的Vue、React 也可以集成TypeScript。

  6. Nodejs框架Nestjs、midway中使用的就是typeScript语法。

 特点:

  1. 免费开源,使用apache授权协议。

  2. 基于ECMAScript标准进行拓展,是JavaScript的超集。

  3. 添加了可选静态类型、类和模块。

  4. 可以编译为可读、符合ECMAScript规范的JavaScript。

  5. 成为一个跨平台的工具,支持所有浏览器、主机和操作系统。

  6. 保证可以与javaScript代码一起运行,无需修改(这一点保证了js项目可以向typescript平滑迁移)。

  7. 文件拓展名是ts。

  8. 编译时检查,不污染运行环境。

TypeScript的安装 编译

这里提供三种方法,请自行选择

 在使用npm命令之前,电脑必须得安装nodejs

npm install -g typescript
或者
cnpm install -g typescript //建议使用
或者
yarn global add typescript

如果电脑没有安装过 cnpm,请先安装cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装完cnpm后,再来安装typeScript

cnpm install -g typescript

如果安装报以下错误:

就是镜像问题,只需设置镜像即可,执行如下代码来设置镜像地址

npm config set registry http://registry.npm.taobao.org

再次执行安装命令即可。

查看是否安装完成:tsc --version 查看版本

配置webstrom自动编译

要在文件夹下面创建一个tsconfig.json的文件,只需在该文件夹下 执行

 tsc --init

生成的文件内容为:

{"compilerOptions": {"module": "commonjs","target": "es5","noImplicitAny": false,"sourceMap": true,"allowJs": true},"exclude": ["node_modules"]
}
target:编译之后生成的JavaScript文件需要遵循的标准。有三个候选项:es3、es5、es2015。
noImplicitAny:为false时,如果编译器无法根据变量的使用来判断类型时,将用any类型代替。为true时,将进行强类型检查,无法推断类型时,提示错误。
module:遵循的JavaScript模块规范。主要的候选项有:commonjs、AMD和es6。
removeComments:编译生成的JavaScript文件是否移除注释。
sourceMap:编译时是否生成对应的source map文件。这个文件主要用于前端调试。当前端js文件被压缩引用后,出错时可借助同名的source map文件查找源文件中错误位置。
outDir:编译输出JavaScript文件存放的文件夹。
include、exclude:编译时需要包含/剔除的文件夹。

配置好这些,就会发现,新建的typescript修改代码后会自动在该.ts文件下生成文件名对应的js

  相关解决方案