Question

我知道很多人都问了同样的问题，但我根本无法让这个问题对我起作用。

我正在尝试创建一个socket.IO应用程序并遵循教程但只是无法将CSS和JS加载到页面中。应用程序总是发送html页面。

我的文件夹结构。

var express = require('express');
const socketIO = require('socket.io');
const path = require('path');

const PORT = process.env.PORT || 3000;
const INDEX = path.join(__dirname, '/public/index.html');

var express = require('express');
var app = express();
app.use(express.static(__dirname + '/public'));

const server = express()
    .use((req, res) => res.sendFile(INDEX) )
    .listen(PORT, () => console.log(`Listening on ${ PORT }`));

const io = socketIO(server);

我的Server.js文件包含：

<link rel="stylesheet" type="text/css" href="/css/styles.css" />
<script src="/js/client.js"></script>

在我的index.html文件中，我像这样调用css和js：

md-button:focus, md-icon:focus {
    outline: none;
}

Answer 1

为什么要使用两个表达变量app和server

尝试以下

const socketIO = require('socket.io');
const path = require('path');
const INDEX = path.join(__dirname, '/public/index.html');

const PORT = process.env.PORT || 3000;

var express = require('express');

const app = express()
    .get('/', function (req, res) {res.sendFile(INDEX)})
    .use(express.static(__dirname + '/public'))
    .listen(PORT, () => console.log(`Listening on ${ PORT }`));

const io = socketIO(app);

Answer 2

这将有效：

const express = require('express');
const app = express();
const http = require('http').Server(app);
const socketIO = require('socket.io')(http);
const PORT = process.env.PORT || 3000;

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

http.listen(PORT, () => console.log(`Listening on ${ PORT }`));

您的代码无法正常运行，因为.use((req, res) => res.sendFile(INDEX))始终会向客户端的任何请求发送index.html。

node.js - 静态文件CSS / JS无法在express中工作

2 个答案: