随着应用的庞大,项目中 javascript 的代码也会越来越臃肿,团队之间的协作也会遇到难题,如果不一直看 api 文档,很难知道团队其他成员写的方法需要什么参数,返回结果又是什么。解决的方案有很多,这里不比较各种方法的优劣,仅说下选择 typescript 的考虑:1、接受程序好,ts 文件中可以直接写 javascript 代码,平滑过渡;2、vs code 的提示够好。下面开始一步一步地搭建 web 服务( windows环境 )一、typescript 开发环境如何配置1、初始化项目yarn init -y2、安装 typescriptyarn add typescript @types/node –dev3、配置 typescript 编译环境在项目根目录下新建文件 tsconfig.json{ “compilerOptions”: { “target”: “es2017”, “outDir”: “./dist”, “module”: “commonjs”, “emitDecoratorMetadata”: true, “experimentalDecorators”: true, “lib”: [ “es6” ], “noImplicitAny”: false, “sourceMap”: false, “allowJs”: true }, “include”: [ “./src//” ], “exclude”: [ “node_modules” ] }4、测试新文件夹 src 并添加文件 server.ts,在文件中写下如下代码console.log(“Hello TypeScript”);5、编译.\node_modules.bin\tsc6、运行node ./dist/server.js如果能看到控制台输出Hello TypeScript恭喜你,typescript 环境配置成功!二、集成 web 开发框架 koa1、安装 koa 及 typesyarn add koa koa-router koa-static @types/koa @types/koa-router @types/koa-static2、修改 server.ts 文件,输入如下内容/ * @Description: 后台服务入口 * @version: 0.1.0 /import * as Koa from ‘koa’;import * as koaStatic from ‘koa-static’import { router } from ‘./router’; const app = new Koa(); / * @name: 设置静态资源目录 * @param : undefined * @return : undefined /app.use(koaStatic(’./www’)); / * @name: 使用路由 * @param : undefined * @return : undefined /app.use(router.routes()); /* * @name: 服务端口 * @param : undefined * @return : undefined /const httpPort = 8080app.listen(httpPort); console.log(Http Server running on port ${httpPort});3、新建路由文件夹 router 及文件 index.ts/ * @Description: 后台路由组件 * @version: 0.1.0 /import * as Router from ‘koa-router’; const router = new Router();router.get(’/’, async (ctx) => { ctx.body = ‘Hell koa’;})export { router }4、编译、运行 打开浏览器,输入 http://localhost:8080如果能看到 Hello Koa,恭喜你,koa 的集成成功。一个简单的 web 服务就实现了。后面如果有机会就讲下如何操作数据库。目录结构如下: