jde*_*927 2 javascript node.js express twitter-bootstrap
我刚开始使用Express,我正在试图找出原因,当我运行我的应用程序时,Bootstrap字体没有呈现(它以简单的Times New Roman显示文本).我很确定我使用的是正确的路径,因为当我在浏览器中打开index.html时,字体会正确呈现.我还尝试使用Bootstrap导航栏,当我尝试通过Node运行时,Bootstrap似乎无法正常工作,但是当我在浏览器中独立查看HTML文件时,它也能正常工作.将Bootstrap目录的路径更改为"/ public/bootstrap ..."会导致它以两种方式错误地呈现.我该如何解决？
index.html的:
<html>
<head>
<title>X</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="../public/bootstrap/css/bootstrap.min.css" type="text/css" rel="stylesheet" media="screen">
</head>
<body>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<div class="container">
<h1>Under Construction</h1>
<p>This website is under construction. Come back soon!</p>
</div>
</body>
</html>
web.js(我的主app文件):
var express = require('express')
var app = express()
app.set('view engine', 'ejs')
app.engine('html', require('ejs').renderFile)
app.get('/', function(req, res) {
res.render('index.html')
})
var port = process.env.PORT || 5000;
app.listen(port, function() {
console.log("Listening on " + port);
})
1)bootstrap和express彼此无关.Bootstrap完全在客户端运行,而express是node.js上的服务器中间件lib
2)你为什么要自己服务引导？更好地使用CDN:
3)如果你坚持自己提供服务,那么添加一个静态目录,以便express可以提供静态文件(当你尝试为yoursite提供js/css但仍然喜欢从CDN提供bootstrap时,添加静态也会为你服务.
app.use(express.static(path.join(__dirname, 'public')));
然后不需要使用public,只需使用你的css的根路径:
bootstrap/css/bootstrap.min.css
i.e.
<link href="../public/bootstrap/css/bootstrap.min.css" type="text/css" rel="stylesheet" media="screen"
| 归档时间： |
|
| 查看次数： |
6082 次 |
| 最近记录： |