【发布时间】：2023-07-31 04:39:01
【问题描述】：
我正在使用 express 构建一个简单的登录应用程序。我使用 ejs 作为我的模板引擎。我的应用程序的文件结构是
package.json
server.js
routes
index.js
users.js
views
layouts.ejs
login.ejs
register.ejs
welcome.ejs
public
css
bitnami.css
bitnami.css 包含我从 bootswatch 下载的 css 代码
server.js 有以下代码
const express = require('express');
const app = express();
const PORT = process.env.PORT;
const expressLayouts = require('express-ejs-layouts');
const path = require('path');
global.appRoot = path.resolve(__dirname);
console.log(path.join(global.appRoot,"public"));
//EJS
app.use(expressLayouts);
app.set('view engine','ejs');
//set static path
app.use(express.static(path.join(global.appRoot,"public")));
//Routes
app.use('/',require('./routes/index'));
app.use('/users',require('./routes/users'));
app.listen(PORT,()=>{
console.log(`server running at ${PORT}`);
})
index.js 有
const express = require('express');
router = express.Router();
router.get('/',(req,res)=>{
res.render('welcome',{layout : 'layouts'});
})
users.js 有
const express = require('express');
router = express.Router();
router.get('/login',(req,res)=>{
res.render('login',{layout : 'layouts'});
})
router.get('/register',(req,res)=>{
res.render('register',{layout : 'layouts'});
})
module.exports = router;
module.exports = router;
layouts.ejs 有以下代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>BNI EVENT</title>
<link rel="stylesheet" href="css/bitnami.css">
<script src="https://kit.fontawesome.com/9c59f82571.js" crossorigin="anonymous"></script>
</head>
<body>
<div class="container">
<%- body %>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
</body>
</html>
如果我从 CDN 加载 css 文件，或者如果我为每个在 '/' ex('/users') 之后具有某些内容的路由器使用静态中间件，css 文件可以工作，但我想知道是否有更少这个问题的冗余解决方案
如果 users.js 具有以下代码，则 CSS 文件可以正常工作
const express = require('express');
router = express.Router();
const path = require('path');
// setting the static middleware for this route
router.use(express.static(path.join(global.appRoot,"public")));
router.get('/login',(req,res)=>{
res.render('login',{layout : 'layouts'});
})
router.get('/register',(req,res)=>{
res.render('register',{layout : 'layouts'});
})
module.exports = router;
【问题讨论】：
标签： css node.js express ejs express-router