번들로 된 각도 2의 앱과 익스프레스

Question

그렇기 때문에 나는 번들로 묶어서/꾸러미로 webpack을 사용하는 일반적인 앵글 cli 프로젝트를 만든 다음 dist 폴더의 내용을 가져 와서 다른 프로젝트에 넣었다.
코드 : // localhost를 : 다른 3000/아무것도

var express = require('express'); 
var app = express(); 
var path = require('path'); 

app.get('/', function(req, res) { 
    res.sendFile(__dirname + '/' + 'index.html') 
}); 

app.listen(3000, function() { 
    console.log('Example app listening on port 3000!'); 
}); 

문제는 내가이 프로그램을 실행할 때 나는 "로드 ..."얻을 페이지를 할 때 켜집니다. 내가 콘솔을 검사 할 때, 나는 얻을 이러한 오류

[리소스를로드 할 수 없습니다 : // localhost를 : 3000/inline.js
자원을로드하지 못했습니다 : 서버 서버가 404 (찾을 수 없음) 상태로 응답 404 (찾을 수 없음) 상태로 응답 함 : // localhost : 3000/styles.b52d2076048963e7cbfd.bundle.js
리소스를로드하지 못했습니다. 서버가 상태 404 (찾을 수 없음)로 응답했습니다. // localhost : 3000/main.d27eab344e583f765067.bundle.js
자원로드 실패 : 서버가 404 (찾을 수 없음) 상태로 응답 함 : // localhost : 3000/styles.b52d2076048963e7cbfd.bundle.js
자원로드 실패 : 서버가 응답 함 404 (찾을 수 없음) 상태 : // localhost : 3000/main.d27eab344e583f765067.bundle.js]

누구든지이 문제를 해결하거나 문제를 파악할 수 있습니까? 어떤 도움이라도 대단히 감사하겠습니다. 내가이 일을하는 이유는 앱이 프로덕션 환경에 들어가면 "npm"에 대한 액세스 권한이 없기 때문에 ang-cli 명령은 없지만 노드 명령 만 가질 수 있다는 것입니다. 또한 소켓 IO를 구현하는 것이 우리가 속달 경로를 택한 또 다른 이유입니다. 다른 방법이 있다면 알려주십시오.

감사합니다.

Answer 1

지금은 index.html 만 전송하므로 나머지 정적 파일을 제공해야합니다.

app.use(express.static('public')); 
app.get('/', function(req, res) { 
    res.sendFile(__dirname + '/public' + 'index.html') 
}); 

Answer 2

나는이 문제에 대한 발견이 솔루션은 별도의 디렉토리에이 개 구성 요소를 놓고, 그들에게이 방법을 구축하는 것입니다

(돈을 :

이 공공 예를 들어, 어떤 디렉토리에 각 응용 프로그램을 넣고 할 '이 t은 빌려로 변경하는 것을 잊지 디렉토리를하기 전에, 각 시간). 다음

ng build --base-href /first/dist 
ng build --base-href /second/dist 

당신이 두 개의 서로 다른 디렉토리

Express에서

에 두 개의 구성 요소가를 : 당신이 사이트를 작업을 찾을 수 있습니다 - 아직

그것이

그레 희망이 도움

app.use(
    '/first', 
    express.static(
     path.join(__dirname,'first', 'dist') 
    ) 
); 

및

app.use(
    '/second', 
    express.static(
     path.join(__dirname,'second', 'dist') 
    ) 
); 

더 나은 솔루션 그들의해야하지만, 나는 그것을 발견하지 않은 on on www.agenda.tools