我正在开始一个使用Angular 4进行前端设计的新项目,应用程序需要一些休息api,我决定使用node。我正在使用angular cli创建角度应用程序,我知道如何创建角度应用程序和节点服务器,但我想知道如何连接这两个东西,以便当我ng serve
时,服务器和角度应用程序都被编译并运行。需要对项目结构或某些文件进行哪些基本更改?
答案 0 :(得分:0)
我目前正在构建一个带有Node / Express后端的全栈Angular应用程序,并且想知道完全相同的事情。然而,尽管scotch.io教程告诉你,在同一目录中创建Express服务器和Angular应用程序并不是最好的方法。
您要做的是在一个项目中设置Express服务器并在一个终端窗口中提供服务,然后在单独的终端窗口中提供Angular应用程序,但要指向本地运行的Express服务器而不是默认服务器Angular CLI(ng-serve
命令)附带的开发服务器。
这是一个Stack Overflow answer和一个Medium article,它回答了我关于如何设置它的所有问题(幸运的是,它并不太难)。
答案 1 :(得分:0)
这就是我做Shubham的事情。我进入Angular-Cli,将“ outDir”:更改为“ ../public”,换句话说,它看起来像"outDir": "../public"
。 ../public文件夹是在我的app.js文件中使用app.use(express.static(path.join(__dirname, 'public')));
请记住,我已经全局安装了nodemon,并且在我的package.json文件中,"start": "node app"
只是从该目录运行nodemon来启动服务器,而Angular和Express都在同一服务器上运行。
我已经看到有人说在Node / Express服务器上运行静态文件是不好的,但是对于开发我不确定这是否重要。尽管我是js框架等方面的新手,但这是我在github acct上的项目文件:https://github.com/chriskavanagh/angularauth。
编辑:更改代码时必须运行ng-build(在Angular目录中)。
答案 2 :(得分:0)
首先,在 Angular 项目中做 ng build
,它会创建 dist
文件夹(静态文件夹)。
第二步,将以下代码粘贴到后端服务器入口点文件中。
app.use(express.static(path.join(__dirname, 'dist/')));
app.get('*', (req, res) =>{
res.sendFile(path.join(__dirname, 'dist/index.html'));
});
以上事情完成后运行后端服务器:node filename
注意:给出您的 index.html
文件在 dist
文件夹中的正确路径。
答案 3 :(得分:-1)
节点服务器和Angular应用程序是两回事。 要运行节点服务器,您应该使用以下命令:
节点ServerName.js
要运行角度应用程序,您应该使用命令:
npm start OR ng serve
在您的情况下,两者之间的连接是由http请求进行的。 例如,您可以使用'表达'为了在您的节点服务器中实现休息服务,然后在当前路由中向服务器发送http请求。