关于server.js启动html时出现的css样式和图片加载问题

明明单独启动

查看server.js代码

javascript 复制代码
app.use(express.static('public'));

发现这样一句话

app.use(express.static('public'))这行代码的作用是指定public目录为静态资源目录,这样客户端就可以直接访问这个目录下的文件了

但是有个非常重要的问题 此时要注意你的路径 当你把css样式或图片放入这个public路径时

不应该是

html 复制代码
    <link rel="stylesheet" href="./public/style.css">
html 复制代码
    <img src="./public/img/school_logo.png" alt="school logo">

而应该是

html 复制代码
    <link rel="stylesheet" href="style.css">
html 复制代码
    <img src="./img/school_logo.png" alt="school logo">

这是因为当用户请求http://端口/images/logo.png时,服务器会自动从public/images/logo.png文件中读取内容并返回给用户,而不需要你编写任何额外的路由处理逻辑

相关推荐
Hilaku1 分钟前
卷AI、卷算法、2026 年的前端工程师到底在卷什么?
前端·javascript·面试
军军君0118 分钟前
Three.js基础功能学习十五:智能黑板实现实例二
开发语言·前端·javascript·vue.js·3d·threejs·三维
ZC跨境爬虫30 分钟前
海南大学交友平台开发实战day7(实现核心匹配算法+解决JSON请求报错问题)
前端·python·算法·html·json
下北沢美食家33 分钟前
CSS面试题2
前端·css
四千岁41 分钟前
Ollama+OpenWebUI 最佳组合:本地大模型可视化交互方案
前端·javascript·后端
写不来代码的草莓熊43 分钟前
el-date-picker ,自定义输入数字自动转换显示yyyy-mm-dd HH:mm:ss格式
前端·javascript·vue.js
Wect1 小时前
JS手撕:手写Koa中间件与Promise核心特性
前端·javascript·面试
张元清1 小时前
React 文件处理:上传、拖放区与对象 URL
前端·javascript·面试
小霍同学1 小时前
Flex + Grid 混合布局指南
css
煜bart1 小时前
使用 TypeScript 实现算法处理
开发语言·前端·javascript