Can't connect node.js and angular 4. How to solve it?

I need to make a MEAN Stack application, but I can't link to Node(express) and angular cli.

I took as a basis the following video, but slightly altered it. Instead mongojs - mongoose and trying to use angular-cli, but something does not work.

after ng gives the following build:
GET http://localhost:3000/inline.bundle.js net::ERR_ABORTED
localhost/:13 GET http://localhost:3000/polyfills.bundle.js net::ERR_ABORTED
localhost/:13 GET http://localhost:3000/styles.bundle.js net::ERR_ABORTED
localhost/:13 GET http://localhost:3000/vendor.bundle.js net::ERR_ABORTED
localhost/:13 GET http://localhost:3000/main.bundle.js net::ERR_ABORTED
localhost/:13 GET http://localhost:3000/inline.bundle.js net::ERR_ABORTED
localhost/:13 GET http://localhost:3000/polyfills.bundle.js net::ERR_ABORTED
localhost/:13 GET http://localhost:3000/styles.bundle.js net::ERR_ABORTED
localhost/:13 GET http://localhost:3000/vendor.bundle.js net::ERR_ABORTED
localhost/:13 GET http://localhost:3000/main.bundle.js 404 (Not Found)


It seems to work.

server.js
var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');

var index = require('./server/routes/index');
var tasks = require('./server/routes/tasks');

var port = 3000;

var app = express();


// View engine
app.set('views',path.join(__dirname,'dist'));
app.set('view engine','ejs');
app.engine('html', require('ejs').renderFile);

// Set The Static Folder
app.use(express.static(path.join(__dirname, 'client')));

// Body Parser
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));

app.use('/', index);
app.use('/api', tasks);

app.listen(port, function(){
 console.log('Server is running on port: '+ port);
});


.angular-cli.json
{
 "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
 "project": {
 "name": "todo"
},
 "apps": [
{
 "root": "src",
 "outDir": "dist",
 "assets": [
"assets",
"favicon.ico"
],
 "index": "index.html",
 "main": "main.ts",
 "polyfills": "polyfills.ts",
 "test": "test.ts",
 "tsconfig": "tsconfig.app.json",
 "testTsconfig": "tsconfig.spec.json",
 "prefix": "app",
 "styles": [
"styles.css"
],
 "scripts": [],
 "environmentSource": "environments/environment.ts",
 "environments": {
 "dev": "environments/environment.ts",
 "prod": "environments/environment.prod.ts"
}
}
],
 "e2e": {
 "protractor": {
 "config": "./protractor.conf.js"
}
},
 "lint": [
{
 "project": "src/tsconfig.app.json",
 "exclude": "**/node_modules/**"
},
{
 "project": "src/tsconfig.spec.json",
 "exclude": "**/node_modules/**"
},
{
 "project": "e2e/tsconfig.e2e.json",
 "exclude": "**/node_modules/**"
}
],
 "test": {
 "karma": {
 "config": "./karma.conf.js"
}
},
 "defaults": {
 "styleExt": "css",
 "component": {}
}
}


index.html



 <meta charset="utf-8">
<title>Todo</title>
 <base href="/">

 <meta name="viewport" content="width=device-width, initial-scale=1">
 <link rel="icon" type="image/x-icon" href="favicon.ico">


<app-root></app-root>



Please help to understand this.

Thanks in advance!
June 14th 19 at 18:56
0 answer

Find more questions by tags AngularNode.js