Javascript 角度为4的平均堆栈应用程序

我正在用Angular 4制作一个平均堆栈应用程序

我所做的：

为my Node/Express应用程序创建了MVC目录结构

创建了一个节点/Express服务器

创建了一个基本API，该API使用带有前缀路径

/API

使用POSTMAN测试API

使用Angular Cli在MEAN stack应用程序的我的根目录中创建Angular项目

在

.angular cli.json中

将

outDir

属性更改为

。/public

已将我的服务器文件更改为将所有其他请求（不会发送到

/api

）发送到Angular应用程序

我的目录结构：

angular src文件夹包含由

angular cli生成的angular应用程序

应用程序api文件夹包含执行所有CRUD操作的my api。这是所有

/api

路由指向的位置

app server文件夹只包含一个路由文件，该文件将所有

/

发送到angular应用程序（

public/index.html

）

public文件夹是angular应用程序的

index.html

文件在运行

ng build

app.js是我的node/express服务器所在的位置，用于重定向传入的api请求

当我运行应用程序时，它会工作。节点服务器使用

public

文件夹将我的请求发送到Angular Apps

index.html

，该文件夹显示我的

app.component.html

模板。

---

我的问题：

• 我运行

  nodemon

  启动我的node/express服务器，然后导航到

  angular src

  文件夹并运行

  ng build

  设置我的angular应用程序。在我看来，这个过程似乎相当漫长，有什么更好的方法来实现这一点

• 此外，每次更改角度时，我都必须运行ng build 应用程序，以便它可以读取更改。有类似于nodemon的东西吗 用于监视更改并自动重置的角度传感器

• 我有2个

  package.json

  文件。一次用于节点/表达式，另一次用于角度。一个项目中应该只有1个

  package.json

  文件吗

• 该应用程序最终必须在Heroku上启动，目前我有一个Procfile，其中包含

  web:npm start

  。我如何管理heroku中的angular 4？是否需要向Procfile添加

  ng build

  命令

• Angular App&Node/express应运行不同的端口（即端口3000和4200），还是应同时运行在单个端口上

• 我实现的结构适合使用Angular 4的平均应用程序

---

我知道其中一些问题可能是基于意见的，但我正在寻求您的专业建议，以了解在这些情况下什么是最佳实践。

这是我的两分钱（我也有一个应用程序在Heroku上以生产模式运行，我遵循了每一个Heroku教程和最知名的教程）：

• 每次都必须运行

  ng build

  。构建允许您缩小代码，而ng serve不允许。我不知道如何使其自动化，但如果您使用Heroku，只需按repo即可构建您的项目（当然，如果您使用正确的命令）

• 是的，你必须根据每一个变化进行重建。如果你在应用中使用i18n，你必须为你实现的每种语言运行

  ng build

  。因此，考虑到所需的时间，您不应该将其自动设置（对我来说，2种语言=6分钟）

• 我只保留了一个

  package.json

  ，将所有依赖项放在那里（后面和前面）

• 我对Heroku的构建命令如下：

  "postinstall": "npm run build-i18n",
  "i18n": "ng xi18n --output-path src/i18n --out-file messages.xlf",
  "build-i18n:fr": "ng build --output-path=dist/fr --aot --prod --bh /fr/ --i18n-file=src/i18n/messages.fr.xlf --i18n-format=xlf --locale=fr",
  "build-i18n:en": "ng build --output-path=dist/en --aot --prod --bh /en/ --i18n-file=src/i18n/messages.en.xlf --i18n-format=xlf --locale=en",
  "build-i18n": "mkdir dist && npm run build-i18n:en && npm run build-i18n:fr"
  

postinstall

由Heroku启动，它为两种语言启动两个版本

• 你应该有不同的端口。事实上，在同一个港口发射它们是不可能的

• 项目的结构可以是您喜欢的。这取决于个人喜好。但我的建议是遵循约翰·帕帕的指导方针

---

感谢您抽出时间回答我的问题。我只是想澄清一下。当我运行

ngbuild

时，它似乎是在一个端口上运行它（在我的例子中是3000）。如何在不同的端口上运行它们？你能给我介绍一些好的heroku教程吗？再次感谢。ng build没有使用任何端口。Ng build是通过缩小代码并将其放入供应商脚本来构建（duh）您的项目。ng serve将使用端口，nodemon也将使用端口，但ng build不会！对于教程，我建议您从这里开始：再次感谢，伙计。有太多的事情需要解决，这让人困惑。我理解。别担心，我花了两个星期才做完。但一旦你完成了，这几乎就是它，你所要做的就是代码！对于开发，您可以使用

proxy.conf.json

文件进行端口转发，并使用

npm run all

，如本回答中所述，使用单个命令运行它-