하나의 하위 경로를 제외한 모든 경로에서 index.html 서비스를 제공하는 Express 앱

Question

index.html 및 bundle.js을 포함하는 dist 공용 디렉토리가있는 react/webpack 앱을 만들었습니다. index.html 번들에 <script src="./bundle.js />으로 링크되어 있으며 모든 경로에 대해 index.html까지 서비스하고 싶습니다 (react-router가 라우팅을 처리하므로). 그러나 /demos/:name의 경우 name에 값이 있으면 정적 파일을 보내려고합니다. 예를 들어 /demos 렌더링을 반응 구성 요소 (서버가 index.html을 전송 함)로 전송하는 동안 /demos/one은 내 서버에서 서버에 /demos/one.html을 요청하는 것으로 해석됩니다. 지금까지 나는 같은 것을 시도했습니다

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

app.get("demos", (req,res) => { 
    res.sendFile(__dirname + "/dist/index.html") 
}) 

app.get("demos/:name", (req,res) => { 
    const { name } = req.params 
    res.sendFile(__dirname + `./demos/${name}.html`); 

}) 

app.use("*", express.static('dist')); 

var server = app.listen(8080, function() { 
    var {host, port} = server.address() 
    console.log(`listening at http://${host}:${port}`) 
}) 

는 그러나, 나는 브라우저 콘솔에서 Uncaught SyntaxError: Unexpected token < 점점 계속.

Answer 1

app.get("demos/:name", (req,res) => { 
    const { name } = req.params 
    res.sendFile(__dirname + `./demos/${name}.html`); 
}) 
app.get("*", (req,res) => { 
    res.sendFile(__dirname + "/dist/index.html") 
})