typescript 有没有办法使用 npm 脚本运行 tsc -watch && nodemon --watch?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/38276862/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-09 07:12:51  来源:igfitidea点击:

Is there a way to use npm scripts to run tsc -watch && nodemon --watch?

typescriptnpmnodemontscts-node

提问by Nicolas Dominguez

I'm looking for a way to use npm scripts to run tsc --watch && nodemon --watchat the same time. I can run this commands independently, but when I want run both of them, only the first one is executed. eg. if I have this script:

我正在寻找一种使用 npm 脚本同时运行tsc --watch && nodemon --watch的方法。我可以独立运行这些命令,但是当我想同时运行它们时,只执行第一个。例如。如果我有这个脚本:

"scripts": {    
    "runDeb": "set NODE_ENV=development&& tsc --watch && nodemon --watch"
  }

tsc --watchis executed but nodemonis never called, and vice versa.

tsc --watch被执行但从nodemon未被调用,反之亦然。

回答by AlterX

I think what you want is something like this (my current setup):

我认为你想要的是这样的(我目前的设置):

"scripts": {
    "compile": "tsc && node app.js",
    "dev": "./node_modules/nodemon/bin/nodemon.js -e ts  --exec \"npm run compile\""
}

I created two scripts "compile" and "dev". To start developing you simply run npm run devwhich starts nodemon and makes it watch .ts files (using the -eflag). Then, every time a .ts file changes nodemon will execthe compile task which basically compiles and runs the node app.

我创建了两个脚本“编译”和“开发”。要开始开发,您只需运行npm run dev它启动 nodemon 并使其监视 .ts 文件(使用-e标志)。然后,每次 .ts 文件更改 nodemon 时,都会exec执行 compile 任务,该任务基本上编译并运行 node 应用程序。

While using concurrently is a good option, my setup guarantees that tsc's work is done before attempting to execute the resulting .js files.

虽然并发使用是一个不错的选择,但我的设置保证tsc在尝试执行生成的 .js 文件之前完成工作。

回答by Borre Mosch

I have been using AlterX's solution for a while now and it has worked perfectly, but I have found it to be rather slow. Instead, I am now using tsc-watch. It makes tsc use incremental compilation similar to the -wflag, making the restart of the application much faster.

我已经使用 AlterX 的解决方案有一段时间了,它运行良好,但我发现它很慢。相反,我现在使用tsc-watch。它使 tsc 使用类似于-w标志的增量编译,使应用程序的重新启动速度更快。

It's as easy as putting something similar to this in your package.json:

就像在 package.json 中放入类似的东西一样简单:

"scripts": {
  "start": "./node_modules/.bin/tsc-watch --onSuccess \"node .\""
}

回答by Alexander Sergeev

Try to add this to your package.json:

尝试将其添加到您的 package.json 中:

"scripts": {
  "start": "concurrently --kill-others \"tsc -w\" \"nodemon dist/app.js\"",
}

And also add this npm packages (concurrently, nodemon, typescript) to your package.json:

并将这个 npm 包(同时,nodemon,typescript)添加到你的 package.json 中:

"devDependencies": {
  "concurrently": "^2.2.0",
  "typescript": "^1.8.10",
  "nodemon": "^1.9.2",
}

回答by billyjov

My solution in october 2018using newest versions of nodemon.

我在201810 月使用最新版本的 nodemon 的解决方案。

first:
install nodemon(npm install nodemon --save-dev) and ts-node(npm install ts-node --save-dev)

首先:
安装nodemon( npm install nodemon --save-dev) 和ts-node( npm install ts-node --save-dev)

second:
create a nodemon.json. I like to keep my nodemon config in a seperat nodemon.json to make the npm scripts a tad easier to read. So create nodemon.jsonin the root of the project with the following content:

第二:
创建一个nodemon.json. 我喜欢将我的 nodemon 配置保存在单独的 nodemon.json 中,以使 npm 脚本更易于阅读。所以nodemon.json在项目根目录下创建如下内容:

{
    "ignore": ["**/*.test.ts", "**/*.spec.ts", ".git", "node_modules"],
    "watch": ["src"], // your .ts src folder
    "exec": "npm start", // your npm script created in package.json
    "ext": "ts"
}

then create your npm startscript e.g like this:

然后npm start像这样创建你的脚本:

"scripts": {
    ...
    "start": "ts-node src/server.ts",
    "dev:ts": "nodemon",
    ...
  }

Then run npm run dev:tsor yarn dev:tsshould run and watchyour typescript server code.

然后运行npm run dev:tsyarn dev:ts应该运行并观察您的打字稿服务器代码。

For more configs like Jestunits tests etc... you can take a look into thisarticle

有关Jest单元测试等更多配置...您可以查看这篇文章

回答by Aidin

What's going on

这是怎么回事

The problem is there are two watchers here on all the files. One is tsc -wand one is nodemon.

问题是所有文件都有两个观察者。一个是tsc -w,一个是nodemon

When a change to a .tsfile is made, tscdetects that, compiles it, and creates the .jsversion in your destination folder.

当对.ts文件进行更改时,tsc检测它,编译它,并.js在目标文件夹中创建版本。

Now from the Nodemon's perspective, it detects two changes (at least) -- one for .tsand one for .js. On the first change it restarts itself, but on the second change it doesn't know that another "start" is going on already, so it tries to restart again and it fails. To me it's a nodemon bug -- see https://github.com/remy/nodemon/issues/763.

现在从 Nodemon 的角度来看,它检测到两个变化(至少)——一个 for.ts和一个 for .js。在第一次更改时,它会自行重启,但在第二次更改时,它不知道另一个“开始”正在发生,因此它尝试再次重启但失败了。对我来说,这是一个 nodemon 错误 - 请参阅https://github.com/remy/nodemon/issues/763

Solutions

解决方案

1) Use tsc-watch --onSuccess

1) 使用 tsc-watch --onSuccess

tsc-watchhas --onSuccesswhich you can put nodeon there. This way you will have only one watcher.

tsc-watch--onSuccess,你可以放在node那里。这样你就只有一个观察者。

2) Delay nodemon

2)延迟nodemon

You can easily delay nodemon restarts (See --delay). It requires the least set up change.

您可以轻松延迟 nodemon 重新启动(请参阅--delay)。它需要最少的设置更改。

3) Have nodemon only monitor destination folder of TSC

3) 让 nodemon 只监控 TSC 的目标文件夹

I couldn't get it to set up, but this way nodemonwill detect only one change hopefully. It might cause problems in future or when tsc generates multiple files.

我无法设置它,但这种方式nodemon有望仅检测到一个更改。将来或 tsc 生成多个文件时,它可能会导致问题。

回答by Coyolero

The TypeScript-Node-Starteris fast

TypeScript-Node-Starter

https://github.com/microsoft/TypeScript-Node-Starter/blob/master/package.json

https://github.com/microsoft/TypeScript-Node-Starter/blob/master/package.json

"dev": "concurrently -k -n \"TypeScript,Node\" -c \"yellow.bold,cyan.bold\" \"npm run watch-ts\" \"nodemon ./dist/app.js\"",
"watch-ts": "tsc -w"

Here we are giving npm run watch-tsthe TypeScriptname (by using concurrently -n) and adding the color yellow.boldby using the concurrently -c.

在这里,我们给npm run watch-tsTypeScript(通过使用名称concurrently -n),并添加颜色yellow.bold使用concurrently -c

So, I can recognize pretty easy the messages for each process.

所以,我可以很容易地识别每个进程的消息。

回答by Kushal Kulle

Normal compilation is: if file name is main.ts

正常编译是:如果文件名是main.ts

step 1: tsc main.ts

第 1 步: tsc main.ts

step 2: node main.js

第 2 步: 节点 main.js

Simple and Onetime(loop) compilation:

简单和一次性(循环)编译:

tsc main --watch

tsc main --watch