反应构建资产表达静态文件夹不服务错误es6

Posted 2023-02-21

【中文标题】反应构建资产表达静态文件夹不服务错误es6

【英文标题】：react build assets express static folder not serving error es6

【发布时间】：2021-03-12 09:57:42

【问题描述】：

您好，我正在尝试从我的静态文件夹中以 express 提供 react 构建资产，它使用 CommonJS 语法。现在我使用 ES6 语法和 express，它不服务于其他文件，但它服务于 index.html 文件：

GET /?session_token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6ImI4Y2QxNTA0LTg3YmEtNGMzMC04ZmI3LWFhZDFkZWQ0ZmFkNCIsImlhdCI6MTYwNjczODExMiwiZXhwIjoxNjA2NzQxNzEyfQ.m4Lf5mimxD_8r14bT_Npg2Ql_ZkiJrFoy6mDfdkx2Sw 200 15.099 ms - 3011
GET /static/css/main.3dccf1f1.chunk.css 404 3.406 ms - 173
GET /static/js/2.0216aaa2.chunk.js 404 1.833 ms - 168
GET /static/js/main.71c89386.chunk.js 404 17.247 ms - 171
GET /manifest.json 404 0.543 ms - 152

这是我在 app.js 中的代码

import express from 'express';
import session from 'express-session';
import dotenv from 'dotenv';
import morgan from 'morgan';
import path from 'path';
import socketListen,socketIO from './socket/init.js';

dotenv.config(path: './config/config.env');

import authController from './controllers/authController.js';


const app = express();

app.use(express.json());
app.use(express.urlencoded(extended: false));
app.use(session(
    resave: false,
    saveUninitialized: false,
    secret: process.env.SECRET_KEY,
    cookie: secure: true
));
app.use(morgan('dev'));
//app.use(express.static(path.join(path.dirname(new URL(import.meta.url).pathname),'public')));
app.use(express.static((path.dirname(new URL(import.meta.url).pathname) + '/public')));
app.use('/api/v1/auth',authController);


const port = process.env.PORT || 5000;

app.get(['/','/nw','/nw/*'],(req,res) => 
    //res.sendFile(path.join(path.dirname(new URL(import.meta.url).pathname),'public','index.html'));
    res.sendFile('index.html',root: 'public');
);

socketListen(4000);

socketIO.on('connect',async() => 
    console.log('crypto client connected');
);

socketIO.on('event',async() => 

);

socketIO.on('disconnect',async() => 
    console.log('crypto client disconnected');
);


app.listen(port, () => console.log(`server is running on port $port`));

这是我的文件结构：

nano_wall
 - app.js
 - /public
     - /static
     - /assets
     - index.html
     - asset-manifest.json
     - manifest.json
     - favicon.ico

我使用 path.join 和 path.dirname(new URL(import.meta.url).pathname 来替换 ES6 的 __dirname，虽然 import.meta.url 代码替换了 __dirname，但它似乎没有正确注册使用 express.static()，所以我使用了 root: 'public' 配置选项。

【参考方案1】：

所以我在玩 express.static 并查看了 serve-static index.d.ts 文件一分钟，我发现有一个 dotfiles 配置选项，您可以在其中决定如何在前面处理 ./文件路径，但我只是使用了“公共”，它似乎可以正常显示。