配置 angular cli build watch 模式和 nodemon watch 的最佳方法是什么? [英] What is the best way to configure angular cli build watch mode and nodemon watch?

问题描述

我正在使用 angular 4 开发一个普通的应用程序.我使用了 angular cli 配置.我想使用监视模式自动构建代码，还想在任何文件更改时重新启动节点服务器.

我使用了以下命令但不起作用

脚本:{"server": "ng build -w && nodemon --watch src/**/*.ts --exec ts-node ./bin/www"}

我将配置保存在目录 bin/www 文件中，该文件从其他地方导入 server.ts.

上述命令的问题是，ng cli 正在构建启用 watch 的代码，但 nodemon 没有启动.

所以我尝试了以下方法.但它的构建只有一次，因为没有为 cli 启用 watch.

脚本:{"server": "ng build && nodemon --watch src/**/*.ts --exec ts-node ./bin/www"}

<块引用>

nodemon 手表在任何一种情况下都不起作用.

解决方案

根据上面的评论，这就是我如何让 2 个服务器工作并响应任何更改的方法.

• 使用 angular-cli 工具和前端服务器创建 Angular 2 应用
• 在这个应用的根目录中创建 server.js 文件，后端服务器，Express 应用的例子是 这里
• 安装包 npm-run-all 以同时启动 2 个服务器
• 在应用程序的根目录中创建文件 server.conf.json，内容如下

<块引用>

<代码>{/api":{"目标": "http://localhost:3000",安全":假}}

• 修改 package.json 以包含此部分

<块引用>

脚本":{"client": "ng serve --proxy-config server.conf.json","server": "nodemon server.js",开始":npm-run-all -p 客户端服务器"}

• 运行npm start"

现在 ng serve 正在观察 Angular 和 nodemon - 在 Node 中的任何变化.

localhost:4200//ng serve =>有角的localhost:4200/page//ng serve =>有角的本地主机:4200/another/page//ng serve =>有角的本地主机:4200/api//ng serve =>节点本地主机:4200/api/users//ng serve =>节点本地主机:3000/api//节点localhost:3000/api/users//节点

Hi I am developing a mean app using angular 4. I have used angular cli configuration. I want to auto build the code using watch mode and also want to restart the node server when any files changed.

I used the following command but not working

script: {
   "server": "ng build -w && nodemon --watch src/**/*.ts --exec ts-node ./bin/www"
}

I have kept the configuration in the directory bin/www file which is importing server.ts from other place.

The problem for above command is, ng cli is building the code with watch enabled but nodemon is not starting.

So i tried the following. but its building only one time as watch is not enabled for cli.

script: {
   "server": "ng build && nodemon --watch src/**/*.ts --exec ts-node ./bin/www"
}

nodemon watch not working in either case.

解决方案

Based on the comments above this is how I made 2 servers working and responsive to any changes.

• create Angular 2 app using angular-cli tool, frontend server
• create server.js file in the root of this app, backend server, example of Express app is here
• install package npm-run-all to start 2 servers simultaneously
• create file server.conf.json in the root of the app with the following content

{
  "/api": {
    "target": "http://localhost:3000",
    "secure": false
  }
}

• modify package.json to have this section

"scripts": {
  "client": "ng serve --proxy-config server.conf.json",
  "server": "nodemon server.js",
  "start": "npm-run-all -p client server"
}

• run "npm start"

Now ng serve is watching any changes in Angular and nodemon - in Node.

localhost:4200                  // ng serve => angular
localhost:4200/page             // ng serve => angular
localhost:4200/another/page     // ng serve => angular
localhost:4200/api              // ng serve => node
localhost:4200/api/users        // ng serve => node
localhost:3000/api              // node
localhost:3000/api/users        // node

这篇关于配置 angular cli build watch 模式和 nodemon watch 的最佳方法是什么?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！