gpt4 book ai didi

javascript - 使用 Express 创建单页应用程序

转载 作者:行者123 更新时间:2023-12-03 02:51:11 26 4
gpt4 key购买 nike

我正在尝试使用 React/Redux/Express 堆栈创建 SPA。我的服务器当前如下所示:

import express from 'express'
import dotenv from 'dotenv'
import path from 'path'

dotenv.config()

const app = express()

app.use(express.static(__dirname + '../client/static/public/'))
app.get('*', (req, res) => {
res.sendFile(path.resolve(__dirname,
'../client/static/public/index.html'))
})
app.listen(process.env.PORT)

在我的 html 中,我有一个带有 src="webpack 捆绑文件路径"的脚本标记。 src 返回 html 文档,而不是捆绑文件的内容。我知道这是因为我的服务器中的包罗万象的路线。我的问题是如何设置路线,以便包罗万象的路线不会干扰其他路线?提前谢谢您!

编辑:

这是我的完整 HTML:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Backers Online</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<body>
<div id="root"></div>
<script src="../build/app.bundle.js"></script>
</body>
</html>

最佳答案

app.use(express.static(...)) 的目的是提供给定目录中的文件。 出于安全原因,它不会提供该目录之外的文件(例如 ../build/app.bundle.js)。因此,您应该根据需要提供的目录多次添加它:

app.use(express.static(__dirname + '/../client/static/public/'));
app.use(express.static(__dirname + '/../client/static/build/'));

然后在客户端,您只需请求文件,HTML 不知道哪些目录保存它们:

<script src="app.bundle.js"></script>

EDIT: You had a typo in the directory paths you serve. Add a / like this: __dirname + '/..'

正如我在评论中所说,如果您显示 __dirname 您会立即看到它。

关于javascript - 使用 Express 创建单页应用程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47851372/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com