我正在尝试用TypeScript和Angular应用程序运行一个开发服务器,而不是每次都转译ts文件。

我发现我可以用ts-node运行.ts文件,但我也想观看.ts文件并重新加载我的应用程序/服务器。这方面的一个例子是命令gulp watch。


当前回答

我宁愿不使用ts-node,总是从dist文件夹运行。 要做到这一点,只需设置您的包。Json默认配置:

....
"main": "dist/server.js",
"scripts": {
  "build": "tsc",
  "prestart": "npm run build",
  "start": "node .",
  "dev": "nodemon"
},
....

然后不加恶魔。Json配置文件:

{
  "watch": ["src"],
  "ext": "ts",
  "ignore": ["src/**/*.spec.ts"],
  "exec": "npm restart"
}

这里,我使用"exec": "npm restart" 所以所有ts文件将重新编译为js文件,然后重新启动服务器。

要在开发环境中运行,

npm run dev

使用这个设置,我将始终从分布式文件运行,而不需要ts-node。

其他回答

把这个加到你的包里。json文件

scripts {
"dev": "nodemon --watch '**/*.ts' --exec 'ts-node' index.ts"
}

要做到这一点,你还需要安装ts-node作为dev-dependency

yarn add ts-node -D

运行yarn dev启动dev服务器

步骤1:你可以简单地安装nodemon和ts-node(如果你已经安装了,跳过)

npm install --save-dev nodemon ts-node

步骤2:你可以在package.json中配置启动脚本

"start": "nodemon ./src/app.ts"

现在nodemon自动从项目中识别typescript,自己使用ts-node命令。使用npm start,它会自动编译/监视和重载。

如果你得到任何错误,如typescript模块没有在项目中找到。在项目文件夹中简单使用此命令。

npm link typescript

我已经抛弃了nodemon和ts-node,取而代之的是一个更好的选择,ts-node-dev https://github.com/whitecolor/ts-node-dev

只需运行ts-node-dev src/index.ts

(编辑) 自从我写了这个答案,nodemon已经改进了很多,现在所需的配置更轻了,性能也更好了。我目前使用这两种方法(显然是在不同的项目中),并且都很满意。

第一步-在deDependencies中安装以下包

npm i -D @types/express @types/node nodemon ts-node tsc typescript

或者使用纱线

yarn add -D @types/express @types/node nodemon ts-node tsc typescript

第二步—在您的tsconfig中使用此配置。json文件

{
  "compilerOptions": {
    "target": "es6" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', 'ES2021', or 'ESNEXT'. */,
    "module": "commonjs" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */,
    "lib": [
      "DOM",
      "ES2017"
    ] /* Specify library files to be included in the compilation. */,
    "sourceMap": true /* Generates corresponding '.map' file. */,
    "outDir": "./dist" /* Redirect output structure to the directory. */,
    "rootDir": "./src" /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */,

    "strict": true /* Enable all strict type-checking options. */,
    "moduleResolution": "node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */,
    "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */,
    "skipLibCheck": true /* Skip type checking of declaration files. */,
    "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
  },
  "exclude": ["node_modules"],
  "include": ["./src"]
}

第三步——在包中使用这些脚本。json文件

"scripts": {
    "start": "node ./dist/server.js",
    "dev": "nodemon -L ./src/server.ts && tsc -w"
},

修改后清除控制台日志

Javascript:

"start": "nodemon -x \"cls && node\" index.js",

打字稿:

"start": "nodemon -x \"cls && ts-node\" index.ts",