安装 TypeScript 并编译成JS

乎语百科 430 0

官网: https://github.com/microsoft/TypeScriptTypeScript是一种由微软开发的开源、跨平台的编程语言。它是JavaScript的超集,最终会被编译为JavaScript代码。 TypeScript是一种应用级JavaScript语言。TypeScript为JavaScript添加了可选类型,支持针对任何浏览器、任何主机、任何操作系统的大规模JavaScript应用的工具。TypeScript编译成可读的、基于标准的JavaScript 特点:

  • 始于JavaScript,归于JavaScript

  • 强大的类型系统

  • 先进的 JavaScript

安装

命令行运行如下命令,全局安装 TypeScript:

npm install -g typescript
npm install -g typescript@next

ps: 可能会失败 最好还是不要加@next检查安装是否成功

tsc -V

安装成功

构建第一个文件

我们写一个JS程序

(() => {
  function sayHi(str) {
    return "hello" + str
  }

  let text = "world"
  console.log(sayHi(text))
})()

然后运行

(() => {
    function sayHi(str: string) {
        return "hello" + str
    }

    let text = "world"
    console.log(sayHi(text))
})()

然后运行会发现这样会报错

编译代码

所以我们需要把ts代码转换成JS 不然就运行不成功,当然 ts文件里都是js代码的话是可以运行的 所以我们可以使用命令把它编译成JStsc .\helloworld.ts这样再同级目录下就会生成一个js代码 以下是JS代码

(function () {
    function sayHi(str) {
        return "hello" + str;
    }
    var text = "world";
    console.log(sayHi(text));
})();

可以发现 类型注解自动的去掉了 并且 let 改成了var

vscode自动编译

我们可以在vscode中让他自动编译成js 直接使用命令

tsc --init

这样会生成一个tsconfig.json的文件安装 TypeScript 并编译成JS

修改tsconfig.json配置

在文件中增加如下内容

{
  // 把ts文件最终编译后放到js的目录中 指定存放的路径
  "outDir": "./js",
  // 不使用严格模式
  "strict": false,
   ...
}

启动监视

我们还需要配置一下监视任务安装 TypeScript 并编译成JS安装 TypeScript 并编译成JS安装 TypeScript 并编译成JS点击上图标红的地方 这样的话 只要一保存就会自动的把ts编译成JS 然后我们新建一个test文件 然后就会发现 自动的多出了一个test.js的文件了安装 TypeScript 并编译成JS

标签:

留言评论

  • 这篇文章还没有收到评论,赶紧来抢沙发吧~