问题/症状

Question

我有一个奇怪的情况，特别麻烦的是，我已经做过很多次了，以至于我不得不错过一些简单的事情。

请帮助我，感觉好像在失去头脑...

问题/症状

我可以从lib文件夹中加载任何js文件
我可以在Web位置 // art / foo / bar.png

root / public / art

无法从CSS或js中加载任何内容，无论如何我所做的一切都给我404错误，这使我完全发疯。
第13行的相同行为已被注释掉
与第14-16行的各种形式相同
与使用和不使用路由器相同

文件夹结构

根
- server.ts
- 公开
- 艺术
  - 子文件夹中的艺术品
- css
  - canvas.css
- js
  - 文件夹中的js文件而不是

代码

  import *从“ express”中表达；
从“路径”导入*作为路径；
// const express = require（“ express”）
// const path = require（“ path”）

让app = express（）
让端口= 3000
让路由器= express.Router（）;

router.use（'/ lib / framework'，express.static（path.join（__ dirname，'node_modules'，'framework'））））;
router.use（'/ lib / redactedLib2'，express.static（path.join（__ dirname，'node_modules'，'redactedLib2'）））;
router.use（'/ lib / redactedLib3'，express.static（path.join（__ dirname，'node_modules'，'redactedLib3'）））;;
router.get（'/'，（req，res）=> res.sendFile（path.join（__ dirname，'index.html'））））
//app.use('/art/*'，express.static（path.join（__ dirname，'public'，'art'））））;
//app.use('/css/*'，express.static（path.join（__ dirname，'public'，'css'）））;;
//app.use('/js/*'，express.static（path.join（__ dirname，'public'，'js'））））;

router.use（'/'，express.static（'public'））

app.use（'/'，路由器）

app.listen（port，（）=> console.log（`转到http：// localhost：$ {port}进行查看。））

解决方案（编辑）

以防万一有人以后发现这个问题，而在整个过程中，我只需要做一个空的缓存并重新加载即可。...如果您使用的是chrome打开开发工具F12，请单击并按住并选择它。

Answer 1

根据您在此处显示的内容，我看到了两个问题。首先是您的目录结构。这与您的实际结构准确吗？因为在您的应用程序中，您要告诉Node将/ art / *转换为/ public / art /目录，但是该目录实际上位于/ art。

第二，它是虚拟路径前缀的格式。删除/ *;无需声明通配符值。它只会弄乱路径。尾部的/也不是必需的，尽管它不会引起问题。无论哪种方式，都将您的路线改到：

router.use('/lib/framework', express.static( path.join(__dirname, 'node_modules','framework')));
router.use('/lib/redactedLib2', express.static(path.join(__dirname, 'node_modules', 'redactedLib2')));
router.use('/lib/redactedLib3', express.static(path.join(__dirname, 'node_modules', 'redactedLib3')));
app.use('/art', express.static(path.join(__dirname, 'public', 'art')));
app.use('/css', express.static(path.join(__dirname, 'public', 'css')));
app.use('/js', express.static(path.join(__dirname, 'public', 'js')));
router.get('/', (req, res) => res.sendFile(path.join(__dirname, 'index.html')));

修复应用程序中的路径联接或修复物理文件结构，将解决加载实际不存在的资源的问题。

Answer 2

根据您在此处显示的内容，我看到了两个问题。首先是您的目录结构。这与您的实际结构准确吗？因为在您的应用程序中，您要告诉Node将/ art / *转换为/ public / art /目录，但是该目录实际上位于/ art。

第二，它是虚拟路径前缀的格式。删除/ *;无需声明通配符值。它只会弄乱路径。尾部的/也不是必需的，尽管它不会引起问题。无论哪种方式，都将您的路线改到：

router.use('/lib/framework', express.static( path.join(__dirname, 'node_modules','framework')));
router.use('/lib/redactedLib2', express.static(path.join(__dirname, 'node_modules', 'redactedLib2')));
router.use('/lib/redactedLib3', express.static(path.join(__dirname, 'node_modules', 'redactedLib3')));
app.use('/art', express.static(path.join(__dirname, 'public', 'art')));
app.use('/css', express.static(path.join(__dirname, 'public', 'css')));
app.use('/js', express.static(path.join(__dirname, 'public', 'js')));
router.get('/', (req, res) => res.sendFile(path.join(__dirname, 'index.html')));

一些expressjs静态文件正在提供，而其他一些则没有

问题/症状

文件夹结构

代码

解决方案（编辑）

2 个答案: