美文网首页
typescript开发环境搭建

typescript开发环境搭建

作者: 默色留恋 | 来源:发表于2021-05-11 10:37 被阅读0次

    TypeScript 其实就是 JavaScript 的超集,也就是说 TypeScript 是建立在 JavaScript 之上的,最后都会转变成 JavaScript。

    开发环境搭建

    1.安装 Node 的运行环境

    官网下载 Node 进行安装(https://node.js.org)
    如果你已经安装了,可以打开命令行工具,然后使用node -v命令查看安装的版本,但是一般还有一个命令需要检测一下,就是npm -v,如果两个命令都可以输出版本号,说明你的 Node 安装已经没有任何问题了。

    2.全局安装 typeScript

    你要使用 TypeScript 先要在你的系统中全局安装一下TypeScript,这里你可以直接在 VSCode 中进行安装,安装命令可以使用 npm 也可以使用 yarn

    npm install typescript -g
    //或
    yarn global add typescript
    
    3.建立项目目录和编译 TS 文件

    新建一个目录TypeScriptDemo(随意位置),然后把这个文件在 VSCode 中打开。
    新建一个Demo1.ts文件,写入下面代码:

    function jspang() {
      let web: string = "Hello World";
      console.log(web);
    }
    
    jspang();
    

    这时候你使用node Demo1.ts是执行不成功的,因为 Node 不能直接运行TypeScript文件,需要用tsc Demo1.ts转换一下,转换完成后typeScript代码被编译成了javaScript代码,新生成一个demo1.js的文件,这时候你在命令行输入node Demo1.js,在终端里就可以顺利的输出jspang的字符了。但是这样操作的效率实在是太低了,你可以使用ts-node插件来解决这个问题

    4.ts-node 的安装和使用

    有了这个插件,我们就不用再编译了,而使用ts-node就可以直接看到编写结果。

    npm install -g ts-node
    

    安装完成后,就可以在命令中直接输入如下命令,来查看结果了。

    ts-node Demo1.ts
    

    此技术借鉴技术胖大神的视频及文档。

    相关文章

      网友评论

          本文标题:typescript开发环境搭建

          本文链接:https://www.haomeiwen.com/subject/lmsgdltx.html