我在设置应用程序的中间件时遇到问题,因此它会为我的一些静态文件提供服务,例如css和js。我希望能够在index.html中的公共目录中包含我的css和js文件。
This is a picture of my current file structure.
这是我的快递服务器的代码。
server.js
var express = require('express');
var path = require('path');
var app = express();
//config
app.set('views', __dirname + '');
app.engine('html', require('ejs').renderFile);
//app.use(express.static(__dirname + '/')); worked when everything was in jqtest
app.use(express.static(__dirname + '/public'));
//routes
app.get('',function(req,res){
res.render('../public/views/index.html')
});
app.env
//server
app.listen(process.env.PORT || 5000);
console.log('app live in 5000');
这些是我试图在我的index.html中使用的src标记,但是不起作用。我知道我可能还需要为组件中的jquery文件设置一个额外的app.use。
index.html
<link rel="stylesheet" type="text/css" href="/public/css/style.css"/>
<script type="text/javascript" src="/components/jQuery/dist/jquery.js"></script>
<script type="text/javascript" src="/public/js/myJS.js"></script>
修改1 我为这个项目公开了我的github。它可用Here
修改2
已经回答了这个问题。非常感谢teleaziz和7zark7帮助指导我完成此过程。
解决方案:
第1步:
因此,在根导向器之外删除应用程序服务器代码时的问题是__dirname不是全局变量。为我的静态文件设置路由的第一步是告诉我的服务器新的根目录。我通过添加teleaziz提供的这行代码
来做到这一点var root = path.normalize(__dirname + '/..');
第2步:
一旦我这样做了,我必须改变公共路由,而不是像teleaziz所建议的那样使用root而不是__dir
app.use(express.static(root + '/public'));
第3步:
一旦完成,我就按照teleaziz和7zark7的建议从index.html中的src中删除/ public /。我的新src标签看起来像这样。
<link rel="stylesheet" type="text/css" href="/css/style.css"/>
<script type="text/javascript" src="/components/jQuery/dist/jquery.js"></script>
<script type="text/javascript" src="/js/myJS.js"></script>
答案 0 :(得分:1)
__dirname
不是一个全局对象,(即使在全局对象下的docs列表中,这会让读者感到困惑!)。它实际上仅限于模块范围,它总是引用包含模块的文件夹。在你的情况下是服务器文件夹,它不是你的项目根目录,
因此,查看文件结构可以:
首先要求路径模块帮助规范化路径:
var path = require('path');
var root = path.normalize(__dirname + '/..');
将__dirname的使用更改为root:
app.use(express.static(root + '/public'));
答案 1 :(得分:0)
从这些中移除public
:
<link rel="stylesheet" type="text/css" href="/css/style.css"/>
<script type="text/javascript" src="/js/myJS.js"></script>
通过映射:
app.use(express.static(__dirname + '/public'));
您不需要public