[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"$fqNVKkTkA5MWnw169iIA8TrsWsfQWhKVtnPr4o7BsMpw":3},{"code":4,"message":5,"data":6},200,"成功",{"id":7,"createdAt":8,"title":9,"content":10,"summary":11,"image":12,"uid":13,"user":14,"categoryId":21,"category":22,"subCategoryId":24,"subCategory":25,"comments":27,"status":17,"reason":28,"notice":28,"visitCount":29,"commentCount":30,"keywords":31},132,"2024-11-03T15:43:25.935Z","Koa后端小项目编程记录 - 项目搭建","## 前言\n对于小型it项目，没必要使用市面上成熟的后端框架来做。之前使用node开发后端项目时，使用了阿里的Midwayjs来做过项目，使用上确实很流畅丝滑，但是我现在项目不大，就从头开始写一个，成册记录。\n\n本篇介绍koa工程的基础搭建。\n\n## 一、前期准备\n1. 电脑上安装node环境；\n2. 使用vscode或者其他软件作为编辑器（本项目使用vscode）；\n3. 包管理器命令随意，既可以npm，也可以选择使用yarn、cnpm都行；\n4. 掌握typescript知识也要熟悉typescript的语法；\n5. 知道koa如何使用；\n6. 要有一点shell脚本知识；\n7. 本项目以Mac电脑环境做演示说明。\n\n## 二、项目搭建\n1. 创建文件夹，工程代码都放在这个文件中；\n2. 打开终端，使用`cd`命令进入到刚创建的空文件路径下，使用以下命令创建一个`package.json`文件 ：\n```terminal\nnpm init\n```\n![npm init项目](https://image.xinwei.ltd/image1730646296209.png)\n如上图所示，会生成包管理文件`package.json`文件，可以一步步设置项目的基本描述信息。\n\n## 三、入口文件\n创建一个`app.ts`文件，用作项目的入口文件，后面项目启动运行都从这个入口文件开始。\n\n## 四、引入typescript支持\n引入`typesript`依赖，以及`tsc`编译器，`tsc`是将`ts`文件编译成`js`的编译器，`ts-node`依赖库可以直接编译ts文件：\n```terminal\nnpm install --save-dev typescript ts-node @types/node\n```\n\n\n## 五、引入eslint代码格式库\n`eslint`支持对typescript语法的lint规则，具体配置可以参考eslint官网：\n[https://typescript-eslint.io/getting-started](https://typescript-eslint.io/getting-started)\n```terminal\nnpm install --save-dev eslint @eslint/js @types/eslint__js typescript typescript-eslint\n```\n\n## 六、创建tsconfig.json文件\n1. `tsconfig.json`文件可以定义ts编译的一些规则，可以通过以下终端命令来生成：\n```terminal\nnpx tsc --init\n```\n（如果电脑中没有安装`npx`工具的话，可以通过npm安装一下）\n全局安装`npx`的终端命令：\n```terminal\nnpm install -g npx\n```\n2. 修改`tsconfig.json`文件，设置一些基本属性：\n![tsconfig.json文件](https://image.xinwei.ltd/image1730647679245.png)\n`rootDir`设置ts文件所在的最外层目录；\n其他如有任何需要，可以逐步修改文件中的配置。\n\n## 七、安装koa以及koa-router\n```terminal\nnpm install koa koa-router \n```\n\n## 八、定义script脚本执行命令\n使用编辑器打开项目文件夹，点击并且编辑`package.json`文件：\n```package.json\n...\n\"scripts\": {\n    \"dev\": \"ts-node app.ts\",\n    \"build\": \"tsc\"\n  },\n...\n```\n![package.json文件摘要](https://image.xinwei.ltd/image1730648232747.png)\n在\"scripts\"配置项中，写入如图所示的配置，那么执行文件时，就可以直接执行：\n`npm run dev`来启动项目。\n\n在根目录下创建一个src的空文件夹，后续所有的文件将在src文件夹下创建开始。\n\n## 九、工程目录\n![koa工程目录](https://image.xinwei.ltd/image1730648445149.png)\n\n至此，基础的工程搭建算是完成。\n\n## 十、测试运行\n测试工程时，可以在`app.ts`中打印语句进行测试。\n```app.ts\nconsole.log(\"Hello world!\");\n```\n然后在终端执行脚本命令：\n```terminal\nnpm run dev\n```\n如果在终端看到输出`Hello world!`，那么即表示工程的基础搭建已经完成。\n\n第一章到此。\n\n","最近开发一个小型it项目，打算使用koa框架做服务端，准备做成一个实战记录，后期可能会整理成册，希望对于想要学习或者参考的同学有帮助。","https://image.xinwei.ltd/image1730646296209.png",499668042977349,{"phone":15,"userId":13,"nickName":16,"vipType":17,"avatar":18,"sign":19,"createdAt":20},"13121171998","全栈老韩",1,"https://image.xinwei.ltd/images/IMG_5430.JPG","全栈工程师，擅长iOS App开发、前端（vue、react、nuxt、小程序&Taro）开发、Flutter、React Native、后端（midwayjs、golang、express、koa）开发、docker容器、seo优化等。","2024-01-01T16:14:30.305Z",2,{"id":21,"name":23},"IT技术",17,{"id":24,"name":26,"parentId":21},"Node",[],"",523,0,"koa,node koa,koa后端,koa服务端开发,服务端开发,node开发,node服务端,node项目,koa项目"]