如何解决 Bootstrap node.js 应用程序中的错误“无法设置未定义的属性 'emulateTransitionEnd'”？答案

【问题标题】：How to solve error "Cannot set property 'emulateTransitionEnd' of undefined" in Bootstrap node.js app?如何解决 Bootstrap node.js 应用程序中的错误“无法设置未定义的属性 'emulateTransitionEnd'”？
【发布时间】：2015-09-13 01:18:27
【问题描述】：

我从头开始创建 Node.js 应用程序，并在 app.js 中添加。

global.jQuery = require('jquery');

之后它给了我如下错误：

/home/yojna/web/node_modules/bootstrap/js/transition.js:36
  $.fn.emulateTransitionEnd = function (duration) {
                        ^
    TypeError: Cannot set property 'emulateTransitionEnd' of undefined
    at /home/yojna/web/node_modules/bootstrap/js/transition.js:36:29
    at Object.<anonymous>(/home/yojna/web/node_modules/bootstrap/js/transition.js:59:2)
    at Module._compile (module.js:456:26)
    at Object.Module._extensions..js (module.js:474:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:312:12)
    at Module.require (module.js:364:17)
    at require (module.js:380:17)
    at Object.<anonymous> 
    (/home/yojna/web/node_modules/bootstrap/dist/js/npm.js:2:1)
    at Module._compile (module.js:456:26)
    yojna@yojna-Inspiron-7520:~/web$

【问题讨论】：

标签： jquery node.js twitter-bootstrap

【解决方案1】：

NPM 包含服务器端库。要包含 bootstrap 或 jquery 等客户端库，您应该改用 Bower。

我在 expressjs 应用程序中完成了这项工作：

创建一个 .bowerrc 文件并写入以下行：
```
{
  "directory" : "public/components"
}
```
使用 Bower 下载 bootstrap 和 jquery：
```
bower install bootstrap
```
然后，在 app.js 文件中将公用文件夹定义为静态：
```
app.use(express.static(__dirname + '/public'));
```

最后，在你的视图中添加脚本标签（我这里用的是 Jade）：

script(src='components/jquery/dist/jquery.min.js')
script(src='components/bootstrap/dist/js/bootstrap.min.js')

【讨论】：

【解决方案2】：

尝试声明美元符号变量：

global.jQuery = global.$ = require('jquery');

【讨论】：

【解决方案3】：

我遇到了这个问题，这是因为我在我的供应商 webpack 2 配置中包含了“bootstrap”但正在使用：

require("bootstrap-loader");

所以浏览器无法正确找到 bootstrap-loader 包。

【讨论】：

这有帮助。我错误地尝试使用 import 'bootstrap'; 在我的 app.module.ts 打字稿文件中包含引导程序，并且应该将其包含在我的 webpack 配置中。

【解决方案4】：

你不应该require它。 Jquery 是客户端库，而 Node.js 是后端服务器。

如果您想在您的 Node.js 应用程序中使用 Jquery，只需将其添加到您的 HTML 文件中：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>

【讨论】：

你没有回答 OP 的问题。