在Express项目中本地包含Bootstrap / Semantic UI?

时间:2016-12-14 13:24:52

标签: css node.js twitter-bootstrap express

我下载了bootstrap的缩小版本并将其放在我项目的根目录中。然后在/ views /中的HTML文件中添加了:

<link rel="stylesheet" href="/bootstrap.min.css">

但是,页面看起来仍然一样,因为没有添加Bootstrap样式。我知道我可以使用CDN,我做了并且它有效,但是现在我想尝试在本地包含它。我试着类似地包括Semantic-UI,但它也没有用。我做错了什么?

1 个答案:

答案 0 :(得分:0)

我想我明白了。假设你的样式表在/ public中,那么你必须将这一行添加到你的应用程序文件中(通常是app.js):

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

从现在开始,您可以使用以下代码从项目的任何位置链接到您的样式表:

<link rel="stylesheet" href="/bootstrap.min.css">

请注意,我们不再需要指定完整路径,即&#34; /public/bootstrap.min.css" - 我们省略&#34; / public&#34; (实际上href="/public/bootstrap.min.css&#34;会出错。)

如果有人读到这个可以解释为什么第一行是必要的,请在下面评论。我相信我明白它的作用,但是为什么Express创作者坚持这样做,即为什么我<link>我的本地文件通常是我不能得到的。