ts为typescript的缩写,是javascript的超集。

npm源改为国内

由于 Node 的官方模块仓库网速太慢,模块仓库需要切换到阿里的源。

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

执行下面的命令,确认是否切换成功。

npm config get registry

如果输出为 taobao字样,则表示切换成功

安装 Postman

Postman 是一个 HTTP 通信测试工具,REST API 的练习会用到它。

请到官网 GetPostman.com 下载独立安装包。

运行tsc报错

在windows10 x64 专业版(10.0.16299) 通过npm 安装ts之后,执行tsc xx.ts,报错信息如下:

tsc : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\tsc.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅
https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。
所在位置 行:1 字符: 1
+ tsc .\model\Person.ts
+ ~~~
+ CategoryInfo : SecurityError: (:) [],PSSecurityException
+ FullyQualifiedErrorId : UnauthorizedAccess

解决办法

执行策略可帮助你防止执行不信任的脚本

1.管理员身份打开powerShell

2.输入set-ExecutionPolicy RemoteSigned

3 选择Y 或者A ,就好了

VS Code 运行ts

在visual studio中 调试 - 执行调试 ,报错如下:

无法找到程序xx.ts,对应的JavaScript,因为无法启动此程序

打开launch.json

需要先执行tsc 把ts编译成js,再执行js

webstrom使用

webstrom界面中有ts的log窗口

安装webstrom之后,有内置的typescript模块,也可以手动安装 npm install -g typescript

webstrom执行ts脚本

以在webstrom下执行ts为例

1、安装ts-node和typescript

https://www.npmjs.com/package/ts-node

# Locally in your project.
npm install -D ts-node
npm install -D typescript # Or globally with TypeScript.
npm install -g ts-node
npm install -g typescript

2、在启动node参数添加(node parameters) --inspect --require ts-node/register

参数
node parameters --inspect --require ts-node/register
working directory 项目根目录
javascript file 要执行的ts文件

webstrom调试ts脚本

安装 JetBrains IDE Support 浏览器扩展插件,可以官网或其它地方下载

确保 webstrom 下 settings - debug - built in server里的端口和浏览器扩展里的端口一致。

需要启动http服务才可以在浏览器运行,并传回webstrom调试。

对于单个的ts文件,还不能使用此方法调试

而且如果是node的web程序就可以。

详细内容查看:WebStorm强大的调试JavaScript功能

ts开发环境搭建的更多相关文章

  1. 转:Windows下的PHP开发环境搭建——PHP线程安全与非线程安全、Apache版本选择,及详解五种运行模式。

    原文来自于:http://www.ituring.com.cn/article/128439 Windows下的PHP开发环境搭建——PHP线程安全与非线程安全.Apache版本选择,及详解五种运行模 ...

  2. [Android系列—] 1. Android 开发环境搭建与Hello World

    前言 開始之前先熟悉几个名词: SDK -- Software Development Kit, 软件开发工具包.这个词并不陌生, JDK,就是Jave Development Kit,相同对于And ...

  3. Windows 7 下 PHP 开发环境搭建(手动)

    Windows 7 下 PHP 开发环境搭建 1.说明 做开发的都知道一句话,就是“站在巨人的肩膀上”.确实现在打开浏览器随便一搜很多一键安装PHP环境的软件,比如wamp.xampp.AppServ ...

  4. TypeScript完全解读(26课时)_1.TypeScript完全解读-开发环境搭建

    1.TypeScript完全解读-开发环境搭建 初始化项目 手动创建文件夹 D:\MyDemos\tsDemo\client-demo 用VSCode打开 npm init:初始化项目 然后我们的项目 ...

  5. rollup 开发环境搭建

    rollup 开发环境搭建 初始化项目使用lerna管理项目 使用npm init 初始化项目 npm init -y 安装lerna并初始化项目 npm install lerna --save-d ...

  6. python开发环境搭建

    虽然网上有很多python开发环境搭建的文章,不过重复造轮子还是要的,记录一下过程,方便自己以后配置,也方便正在学习中的同事配置他们的环境. 1.准备好安装包 1)上python官网下载python运 ...

  7. IntelliJ IDEA安装及jsp开发环境搭建

    一.前言 现在.net国内市场不怎么好,公司整个.net组技术转型,就个人来说还是更喜欢.net,毕竟不是什么公司都像微软一样财大气粗开发出VS这样的宇宙级IDE供开发者使用,双击sln即可打开项目, ...

  8. Qt for Android开发环境搭建及测试过程记录

    最近学习了Qt的QML编程技术,感觉相较于以前的QtGUI来说更方便一些,使用QML可以将界面与业务逻辑解耦,便于开发. QML支持跨平台,包括支持Android平台,因此可以使用Qt的QML进行An ...

  9. node.js之开发环境搭建

    一.安装linux系统 (已安装linux可跳此步骤) 虚拟机推荐选择:VirtualBox 或者 Vmware (专业版永久激活码:5A02H-AU243-TZJ49-GTC7K-3C61N) 我这 ...

随机推荐

  1. 远程访问阿里云服务器jupyter

    官网链接 一.pip安装jupyter安装Anaconda的话,会自动按照jupyter,就不需要再使用pip安装了 pip3 install jupyter 二.生成jupyter notebook ...

  2. request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/"

    String path = request.getContextPath(); String basePath = request.getScheme()+"://"+reques ...

  3. Android 中的AlertDialog使用自定义布局

    Android使用指定的View开发弹窗功能 Android开发中进程会使用到我们的AlertDialog,但是比较可惜的是我们的Android原生的AlertDialog的效果又比较的简陋,这个时候 ...

  4. 【PAT甲级】Public Bike Management 题解

    题目描述 There is a public bike service in Hangzhou City which provides great convenience to the tourist ...

  5. golang数据结构之插入排序

    //InsertSort 插入排序 func InsertSort(arr *[]int) { ; i < len(arr); i++ { insertVal := (*arr)[i] inse ...

  6. js获取url参数值的方法总结

    1.方式一:通过字符串截取的方式获取参数值: 1).函数一:获取URL中的参数名及参数值的集合 /** * [获取URL中的参数名及参数值的集合] * 示例URL:http://htmlJsTest/ ...

  7. 大话设计模式Python实现- 享元模式

    享元模式(Flyweight Pattern):运用共享技术有效地支持大量细粒度的对象. 下面是一个享元模式的demo: #!/usr/bin/env python # -*- coding:utf- ...

  8. SpringBoot系列之配置文件加载位置

    SpringBoot系列之配置文件加载位置 SpringBoot启动会自动扫描如下位置的application.properties或者application.yml文件作为Springboot的默认 ...

  9. pytest框架与unittest框架的对比

    一.pytest的优势 pytest是基于unittest之上的单元测试框架,它的优势如下: 自动发现测试模块和测试方法 断言使用 assert + 表达式 可以设置测试会话级(session).模块 ...

  10. JMS消息传递类型特点介绍

    对于消息的传递有两种类型: 一种是点对点的,即一个生产者和一个消费者一一对应: 另一种是发布/ 订阅模式,即一个生产者产生消息并进行发送后,可以由多个消费者进 行接收. 特点介绍: 点到点模型点对点传 ...