创建节点角度应用程序 [英] Creating a node angular app

问题描述

我正在创建一个节点角度应用程序.正如我所确定的，有两种方法.

I`m creating a node angular app. As i identified there are two ways.

1. 作为单个应用程序.所以它是一个节点项目，里面有 angular 文件夹(客户端).所以文件结构是提前的.

1. As a single app. So it is a node project and angular folder (client) is inside it. So the file structure is advance.

作为两个独立的应用程序.所以 angular app 和 node app 是分开的，angular app 使用 node app 的 url 获取数据.此处的文件结构更易于理解且易于编码.

As two separate apps. So angular app and node app are separate and angular app get data using the url of node app. here the file structure is more understandable and easy to code.

谁能告诉我什么是更好的方法.

can anyone explain me what is the better way.

推荐答案

开发.

Node 和 Angular 项目应该是分开的.每个项目都有自己的 package.json.使用配置的 REST 端点启动 Node 应用程序(例如在端口 8000 上) - 它将返回 JSON.

The Node and Angular projects should be separate. Each of the projects has its own package.json. Start the Node app (e.g. on port 8000) with configured REST endpoints - it'll be returning JSON.

使用 Angular CLI ng serve 启动客户端，这将在端口 4200 上启动开发服务器.要从运行在 4200 上的 Angular 应用程序访问端口 8000 上的数据服务器，您需要配置一个小的 proxy-conf 文件所以浏览器不会给你 CORS 错误.例如，如果您的 Node 应用程序有一个端点/api/products，则在您的 Angular 项目中创建一个文件 proxy-conf.json:

Start the client using Angular CLI ng serve, which will start the dev server on port 4200. To access the data server on port 8000 from your Angular app that runs on 4200 you'll need to configure a small proxy-conf file so the browser won't be giving you CORS errors. For example, if your Node app has an endpoint /api/products, create a file proxy-conf.json in your Angular project:

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

现在您可以继续针对开发服务器进行 Angular 编码，但数据将来自 Node 服务器:

Now you can continue Angular coding against the dev server, but the data will be coming from the Node server:

ng serve --proxy-config proxy-conf.json

部署.

使用 Express API，在您的 Node 服务器上定义将包含静态内容(您的 Angular 包和资源)的文件夹.

Using Express API, define the folder on your Node server that will contain static content (your Angular bundles and resources).

使用 ng build 构建包并将 dist 目录的内容复制到节点应用程序上的静态目录中.

Build the bundles using ng build and copy the content of your dist dir into that static dir on the node app.

这篇关于创建节点角度应用程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！