如何在index.html中使用express / nodejs正确包含外部css和js文件?

时间:2014-09-30 19:29:59

标签: node.js express

我正在尝试将我的html包装在nodejs express app(最新版本的express)中。我尝试使用res.sendFile发送我的" index.html"文件。我遇到了一个问题,当在浏览器中加载页面时有很多404,因为它无法找到我的任何js或css文件。我的js文件位于bower_components目录中,有些位于" js"目录。我的css文件位于" css" 。目录

一个人的路径是:

/bower_components/jquery/dist/jquery.min.js

在我的server.js文件和index.html文件中更新的最佳方法是什么,以便它可以找到所有" css"和" js"文件?

2 个答案:

答案 0 :(得分:2)

您可以使用指令express.static

var server = express();
server.use(express.static(path.join(__dirname, 'static')));

它将查找静态文件夹以提供静态文件。只需将您的css和js文件放在此文件夹中,然后在模板的<head>部分中引用它们(在您的情况下为index.html)

答案 1 :(得分:1)

如果你的app.js文件中有这两行代码:

app.use(express.static(path.join(__dirname, 'public')));
app.set('views', path.join(__dirname, 'views'));

然后,您需要将HTML文件放在视图文件夹中。 我自己使用ejs(templator)来渲染HTML文件等等,将这行代码添加到我的app.js中:

app.set('view engine', 'ejs');

然后通过将HTML fils的扩展名更改为.ejs,您可以使用以下代码呈现它们:

res.render('file_name');

更多信息

例如,如果您在/public/css/style.css中有一个css文件,则必须使用以下地址链接到您的html:./css/style.css或类似的内容。