Node Js sunucusu ile Angular2 uygulamasını çalıştırma

Angular2 (istemci tarafı) ve Node JS (sunucu tarafı) teknolojileriyle yeni bir proje başlatıyorum.Node Js sunucusu ile Angular2 uygulamasını çalıştırma

node ve express kullanarak RESTful API oluşturmayı başardım. Belirli bir URL girildiğinde, eşleşen Json cevabı görüntülenir. Çok uzak çok iyi.

Şimdi Angular 2'yi işlemeye dahil etmeye çalışıyorum. App.component'i oluşturdum. sayfa görüntülendiğinde, bileşen yüklü değil ve bazı 404 kodları var:

├── App 
| └── app.component.ts    //copied from Angular2/get-started 
| └── main.ts       // copied from Angular2/get-started 
├── dist         //contains generated JS files 
├── node_modules 
├── server        // contains Server Typescript files 
├── index.html       // copied from Angular2/get-started 
├── index.ts        // server entry point 
├── package.json 
├── systemjs.config.js 
├── tsconfig.json 
├── typings.json

Benim package.json:

{ 
    "main": "index.js", 
    "scripts": { 
    "start": "tsc && concurrently \"npm run tsc:w\" \"node dist/js/index.js\" ", 
    "postinstall": "typings install", 
    "tsc": "tsc", 
    "tsc:w": "tsc -w", 
    "typings": "typings" 
    }, 
    "dependencies": { 

    "@angular/common": "2.0.0-rc.1", 
    "@angular/compiler": "2.0.0-rc.1", 
    "@angular/core": "2.0.0-rc.1", 
    "@angular/http": "2.0.0-rc.1", 
    "@angular/platform-browser": "2.0.0-rc.1", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.1", 
    "@angular/router": "2.0.0-rc.1", 
    "@angular/router-deprecated": "2.0.0-rc.1", 
    "@angular/upgrade": "2.0.0-rc.1", 

    "systemjs": "0.19.27", 
    "core-js": "^2.4.0", 
    "reflect-metadata": "^0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "zone.js": "^0.6.12", 
    "angular2-in-memory-web-api": "0.0.11", 
    "bootstrap": "^3.3.6", 

    "express": "^4.13.4", 
    "mysql": "^2.5.4" 
    }, 
    "devDependencies": { 
    "concurrently": "^2.0.0", 
    "typescript": "^1.8.10", 
    "typings": "^1.0.4" 
    } 
}

İşte

Failed to load resource: 404 (not found) http://localhost:3000/node_modules/core-js/client/shim.min.js 
... 
Failed to load resource: 404 (not found) http://localhost:3000/systemjs.config.js

benim projem yapıdır Ve benim dizin.ts (sunucu) "... Index.html Yükleniyor"

<html> 
<head> 
    <script>document.write('<base href="' + document.location + '" />');</script> 
    <title>Angular 2 QuickStart</title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <!-- 1. Load libraries --> 
    <!-- Polyfill(s) for older browsers --> 
    <script src="node_modules/core-js/client/shim.min.js"></script> 
    <script src="node_modules/zone.js/dist/zone.js"></script> 
    <script src="node_modules/reflect-metadata/Reflect.js"></script> 
    <script src="node_modules/systemjs/dist/system.src.js"></script> 
    <!-- 2. Configure SystemJS --> 
    <script src="systemjs.config.js"></script> 
    <script> 
     System.import('app').catch(function (err) { 
      console.error(err); 
     }); 
    </script> 
</head> 
<!-- 3. Display the application --> 
<body> 
<h1>index.html</h1> 
<my-app>Loading...</my-app> 
</body> 
</html>

http://localhost:3000/ yükleme, görüyorum ama bileşeni gösterilmez:

index.html sonuç olarak.

Resmi Angular2 web sitesinde, lite-server bağımlılığını kullanırlar. Sanırım sunucumda yanlış bir şey var, ama nasıl çalışacağımı anlayamıyorum. Veya Express ve lite-server kullanarak RESTful API uygulamak için bir yolu var mı?

kaynak

2016-06-12 DavidL

js libs ve css gibi statik dosyaları sunmak için bir middleware işlevi eklemeyi unutmuşsunuzdur. app.get("/", ...) önce bu hattı ekleme çalışması gerekir:

app.use(express.static(__projectRoot));

kaynak

2016-06-12 17:29:31 Zen

Evet, daha önce düşündüm, solu için teşekkürler Her neyse! – DavidL

İlgili bir sorum var. Yorum yapmaya istekli misiniz? İşte bağlantı: http://stackoverflow.com/questions/38625483/error-enoent-no-such-file-or-directory-with-angular2-and-express-js – FirstOfMany

yol paketini üst

var path = require('path');

bu ve

var app = express();

 app.use(express.static(path.join(__dirname, 'your-dir-name')));

sonra bu kullanmak

kullanım --save npm i yolunu yükledikten sonra

kaynak

2017-01-13 16:04:22

Node Js sunucusu ile Angular2 uygulamasını çalıştırma

cevap

İlgili konular