Question

我只是想知道是否有任何命令会直接编译打字稿代码并获得输出。现在，我正在做的是，每次当我在文件中进行更改时，我必须重新运行命令以便编译它

npm start

这启动浏览器，然后我必须使用ctrl + c停止执行，然后我必须使用npm命令运行该文件

node filename

查看输出。

所以我想知道的是，是否有任何npm命令将编译.ts文件并查看我在使用

运行文件时在文件中所做的更改

node filename

命令

Answer 1

您可以使用tsc参数启动--watch命令（typescript编译器）。

这是一个想法：

使用tsconfig.json文件
运行tsc --watch，因此每次更改.ts文件时，tsc都会编译它并生成输出（假设您配置了typescript以将输出放入./dist }文件夹）
使用nodemon观看./dist中的文件是否已更改，以及是否需要重新启动服务器。

以下是一些可以帮助您完成此操作的脚本（放入package.json）（您需要安装以下模块npm install --save typescript nodemon npm-run-all rimraf）

"scripts": {
    "clean": "rimraf dist",
    "start": "npm-run-all clean --parallel watch:build watch:server --print-label",
    "watch:build": "tsc --watch",
    "watch:server": "nodemon './dist/index.js' --watch './dist'"
}

然后你只需要在终端

中运行npm start

Answer 2

这是基于@ThomasThiebaud提出的解决方案。在nodemon尝试启动服务器之前，我必须稍微修改它以确保文件是在dist/中构建的。

"scripts": {
    "clean": "rimraf dist",
    "build": "tsc",
    "watch:build": "tsc --watch",
    "watch:server": "nodemon './dist/index.js' --watch './dist'",
    "start": "npm-run-all clean build --parallel watch:build watch:server --print-label"
  },

您仍然需要运行npm start来启动整个事情。

Answer 3

这是我的方法，假设您将所有typescript文件保留在src文件夹中，并希望在javascript文件夹中生成输出的./dist文件。

{
    "name": "yourProjectName",
    "version": "1.0.0",
    "description": "",
    "main": "./dist/index",
    "types": "./dist/index",
    "scripts": {
        "dev": "tsc --watch & nodemon dist"
    },
    "author": "Gh111",
    "license": "ISC",
    "devDependencies": {
        "yourdevDependencies": "^1.0.0"
    }
}

和打字稿配置文件tsconfig.json

{
  "compilerOptions": {
    "target": "es5",       
    "module": "commonjs",  
    "outDir": "./dist",    
  },
  "include": ["./src/**/*"],
  "exclude": [
    "node_modules"
  ]
}

好的，这是怎么回事

首先，我们应该创建tsconfig.json并告诉打字稿将编译后的文件放入./dist文件夹中，同时我们应该排除node_module文件夹或任何我们想要的东西，并包括所有内容来自["./src/**/*"]目录。

之后，在packages.json文件中，我们应指定编译后的index.js文件的路径

“主要”：“ ./ dist / index”

最后，我们告诉tsc到--watch任何typescript的变化，nodemon观察./dist目录中的内容以及是否有变化nodemon将重新启动服务器。

"scripts": {
    "dev": "tsc --watch & nodemon dist"
 },

要运行脚本，请输入npm run dev

如何使用npm命令编译打字稿？

3 个答案: