如何在 express 中使用 npm 安装的引导程序？答案

【问题标题】：How to use npm-installed bootstrap in express?如何在 express 中使用 npm 安装的引导程序？
【发布时间】：2015-08-09 00:56:12
【问题描述】：

我是 Node.js 开发的初学者，现在我尝试在我的第一个 Express 网络应用中使用引导框架。

我用

npm install bootstrap

下载文件，似乎 npm 将它们放在我的 node_modules 文件夹中。

我的问题是如何在 express 中引用我的视图中的引导文件？

我知道一种典型的方法是将引导文件复制到公用文件夹中。所以我的html文件可以找到它们。但我不认为这是一个好主意。

谢谢。

【问题讨论】：

【解决方案1】：

您必须在标题或主脚本底部的<script> 和<link> 标记中引用它。

如果您使用的是 express，那么您可能正在使用模板。要在标题部分或主模板中使用它（取决于您管理视图的方式），例如：

<script language="javascript" src="node_modules/bootstrap/.../bootstrap.min.js"></script>

和

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

这仅在您没有使用 gulp 或 grunt 任务移动文件时才有效

【讨论】：

【解决方案2】：

你需要在你的 server.js 中使用：

app.use(express.static(__dirname + '/node_modules/bootstrap/dist'));

定义一个静态资源然后使用：

<script language="javascript" src="js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/bootstrap.min.css"/>

【讨论】：

你可能想为你的静态添加一个virtual path prefix：app.use("/bootstrap", express.static(path.join(__dirname, '/node_modules/bootstrap/dist/css')));

【解决方案3】：

我发现了一个类似的question。 @augusto-goncalves 更好地解释了解决方案。他的解决方案对我有用。它类似于@victor-behar 的解决方案，但更详细并消除了混乱。

【讨论】：

【解决方案4】：

还有一种方法可以使用 node sass 中间件在 express 中转译 scss，例如 https://github.com/sass/node-sass-middleware。

这样你就可以覆盖 bootstrap scss。你可以用 webpack 对 JS 做同样的事情：编译客户端 js，然后在你的前端包含 bundle.js。

【讨论】：