配置TS + node 的开发环境

Anshiii 发布于2019-08-23 18:05 / 2696人阅读

摘要：直接配置的开发环境还是挺麻烦的，这里我总结了一套开发模板，可以在用的时候可以考虑直接这个项目，项目地址以这个项目为基础模板来开发就行。配置文件是我们配置的阅读配置文件使我们的代码检查配置文件这个文件主要是继承了官方推荐的代码风格。

直接配置ts的开发环境还是挺麻烦的，这里我总结了一套开发模板，可以在用的时候可以考虑直接clone这个项目，
项目地址https://github.com/fish-node/...
以这个项目为基础模板来开发就行。

$ tree
.
├── README.md
├── jest.config.js
├── package.json
├── src
│   ├── index.ts
│   ├── math.ts
│   └── server.ts
├── test
│   ├── math.test.ts
│   └── server.test.ts
├── tsconfig.json
└── tslint.json

ts-node

因为ts是建立在js的基础之上的，但是node又不能直接运行ts代码，实际使用是往往需要使用tsc将ts代码编译成js代码，这无疑是很麻烦的。

而ts-node则包装了node，它可以直接的运行ts代码，使用起来很方便，它的官方仓库在这里 https://github.com/TypeStrong... ,基本用法请自行查看它的readme。

我这里就是把ts-node写到package.json，大家在npm install之后，就可以通过

$ npx ts-node src/index.ts

这种方式来运行ts代码，很方便。

然后我们知道node中有个nodemon，可以在开发时自动的重启我们的node程序，而在ts-node中，对应的就是ts-node-dev

$ npx ts-node-dev src/index.ts

示例代码

在src目录下，我写了三个基本的ts代码

math.ts就是最基本的ts的用法

然后server.js展示了如何使用ts编写一个http服务器

index.ts则展示了ts中的模块化的使用

测试框架

然后我使用Jest 作为测试框架，在test目录下展示了用Jest + Ts 编写我们的测试程序。
运行测试文件的话，可以使用

$ npm run test

@types

@types/node @types/jest 是ts中类型声明文件，它可以给js编写的模块赋予类型系统，让我们享受类型系统的好处。

配置文件

.editorconfig是我们配置IDE的阅读配置文件

tslint.json使我们的代码检查配置文件
这个文件主要是继承了官方推荐的代码风格。不过为了调试方便，把"no-console"这个条件设置为false了

tsconfig.json

然后重点是我们的ts配置文件。

一般来说，json文件是不支持注释的，但是ts官方为了方便，对这个文件多带带做了加强，使得我们可以使用注释，注释语法和js中的一样。

{
    "compilerOptions": {
        "target": "es2018",
        "module": "commonjs",
        "outDir": "./dist/",
        "rootDir": "./src/",
        "strict": true,
        "moduleResolution": "node",
        "esModuleInterop": true,
        "experimentalDecorators": true
    },
    "exclude": ["./test"]
}

其中的target就是编译后js代码的版本，因为我们是node环境，没必要考虑浏览器的兼容问题，所以大家还是尽量的使用更新的版本吧。

而module选项则是我们的模块管理机制，因为我们的ts-node目前还不指出es的模块管理机制，参考这个问题https://github.com/TypeStrong... ，所以我们还是继续使用commonjs规范。

然后rootDir就是我们的源代码目录，outDir就是我们的编译后代码的目录。同时我们设置了exclude这个选项，把我们的测试文件排除在外。

GPU云服务器云服务器 java开发环境的配置服务器配置node环境 linux系统如何配置java系统的开发环境开发环境配置

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/104651.html

TypeScript在react项目中的实践

摘要：前段时间有写过一个在项目中的实践。在里边有解释了为什么要使用，以及在中的一个项目结构是怎样的。关于的配置文件，在本项目中存在两份。一个需要注意的小细节因为我们的与实现版本中都用到了。前段时间有写过一个TypeScript在node项目中的实践。在里边有解释了为什么要使用TS，以及在Node中的一个项目结构是怎样的。但是那仅仅是一个纯接口项目，碰巧赶上近期的另一个项目重构也由我...

Hwg 2019-08-23 11:31 评论0 收藏0
使用typescript开发调试nodejs

摘要：原文地址这两天在看也在入门中网上大部分教程都是前端配置开发调试这个也有很多相当成熟的实践教程这篇文章主要是的配置说起来也是相当简单的不涉及任何的语法与概念同时也可以根据本文配置的开发环境主要是模块部分的使用说起大家应该都挺熟悉了是一个原文地址 https://github.com/xiadd/blog/issues/8 这两天在看ts,也在入门中, 网上大部分教程都是前端配置ts开发...

张春雷 2019-08-21 16:54 评论0 收藏0
js进化，迁徙到typescript

摘要：我开始重新了解一下的现状，没想到已经完全走上正轨了，在上已经有大量的项目选用，投入生产于是报着尝试的心态，开始了迁徙。 js进化，迁徙到typescript TypeScript 历史 TypeScript是一种由微软开发的自由和开源的编程语言它是JavaScript的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程 2012年十月份，微软发布了首个公开版...

Alan 2019-08-21 15:51 评论0 收藏0
Angular开山篇

摘要：环境搭建今天给大家介绍种环境搭建的方法。官方的地址步骤安装种子文件没有的，可以自己下来，然后打开，执行。使用版本为版本。存放表单相关内置组件与指令。存放网络请求相关的服务等。等待加载完毕即可。从而实现了页面的显示 1：环境搭建今天给大家介绍4种环境搭建的方法。一：Angular-cli的安装官方指导文档：www.angular.cn/guide/quickstart 请使用cn...

Edison 2019-08-22 11:11 评论0 收藏0
使用gulp和vsc构建高效的typescript开发环境

摘要：出于某些原因，近期开始需要在公司推广使用写服务端，因为之前使用开发过多个个人项目，所以知道新手开发非常容易将代码写的散乱并且不易后人理解。所以折中的选择了开发，也就用起了。出于某些原因，近期开始需要在公司推广使用nodejs写服务端，因为之前使用es6开发过多个个人项目，所以知道新手开发node非常容易将代码写的散乱并且不易后人理解。本人刚入行的时候做的是java，觉得强类型的语言更...

JerryZou 2019-08-22 10:42 评论0 收藏0