【九月打卡】第55天 TypeScript(11)
2022/9/30 4:16:22
本文主要是介绍【九月打卡】第55天 TypeScript(11),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
TS的编译运行的进一步理解
tsc命令
- tsc: 将ts文件编译为js文件
安装
npm i typescript -D
使用
tsc [文件名] // 不加文件名,编译全部的ts文件
ts-node命令
- ts-node: 将ts文件内部编译成js,然后执行js代码(不会生成js代码)
安装
npm i ts-node -D
使用
ts-node index.ts
如何将编译的js文件单独放在另一个目录中
直接执行tsc,生成的js文件和ts文件都混在一个目录里,现在要ts和js文件分开,编译生成的js单独放在dist目录
解决方法:tsconfig.json中有个配置项:outDir;如下进行配置
{ "compilerOptions": { "outDir": "./dist", } }
如何ts文件修改后动态编译js文件?
-w 可以动态监听ts文件的修改并实时编译成js文件
tsc -w
nodemon
在node环境下执行js文件
node index.js
如何监听js文件变化;可以使用nodemon
安装
npm i nodemon -D
使用
nodemon node index.js
实现功能:动态编译ts文件,并动态执行js文件
在package.json中
"scripts": { "build": "tsc -w", "start": "nodemon node ./dist/crowller.js" },
执行npm run build
会动态编译ts文件;
然后执行npm start
会动态执行js文件
产生的问题1:
问题:
- 执行上述命令后, nodemon会一直反复的不断执行
原因:
- 代码执行后会动态往data/data.json中写入数据,写入数据表示文件有变化,又触发nodemon,然后再写入,再触发nodemon,如此循环下去
解决:
- nodemon进行配置,过滤data目录下的文件
在package.json中
"scripts": { "build": "tsc -w", "start": "nodemon node ./dist/crowller.js" }, "nodemonConfig": { "ignore": [ "data/*" ] },
产生的问题2:
执行命令后会同时开启两个命令行窗口,有没有办法只开启一个命令行呢?
答案是有的,使用concurrently来并行执行
安装
npm i concurrently -D
使用
"scripts": { "dev:build": "tsc -w", "dev:start": "nodemon node ./dist/crowller.js", "dev": "concurrently npm:dev:build npm:dev:start" },
npm:dev:build
的第一个冒号是固定写法,可以看做是run;第二个是命令dev:build
中自带的;多个命令之间空格来间隔
如果命令是dev-build
,那么下面应该写成npm:dev-build
启动时输入 npm run dev即可
命令优化npm:dev:build npm:dev:start
可以简写为npm:dev:*
,就是运行所有带dev:的命令
最终优化的命令
package.json中
"scripts": { "dev:build": "tsc -w", "dev:start": "nodemon node ./dist/crowller.js", "dev": "concurrently npm:dev:*" }, "nodemonConfig": { "ignore": [ "data/*" ] },
tsconfig.json中
{ "compilerOptions": { "outDir": "./dist", } }
这篇关于【九月打卡】第55天 TypeScript(11)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-05-15PingCAP 黄东旭参与 CCF 秀湖会议,共探开源教育未来
- 2024-05-13PingCAP 戴涛:构建面向未来的金融核心系统
- 2024-05-09flutter3.x_macos桌面os实战
- 2024-05-09Rust中的并发性:Sync 和 Send Traits
- 2024-05-08使用Ollama和OpenWebUI在CPU上玩转Meta Llama3-8B
- 2024-05-08完工标准(DoD)与验收条件(AC)究竟有什么不同?
- 2024-05-084万 star 的 NocoDB 在 sealos 上一键起,轻松把数据库编程智能表格
- 2024-05-08Mac 版Stable Diffusion WebUI的安装
- 2024-05-08解锁CodeGeeX智能问答中3项独有的隐藏技能
- 2024-05-08RAG算法优化+新增代码仓库支持,CodeGeeX的@repo功能效果提升