捆绑Bootstrap 4 - Bootstrap工具提示需要Tether

Question

我有一个使用Bootstrap 4构建的应用程序.在这个应用程序中,我有一个Bower文件,具有以下内容:

bower.json

{
  "name": "myApp",
  "version": "1.0.0",
  "dependencies": {
    "jquery": "2.1.4",
    "tether": "1.2.0",
    "bootstrap": "v4.0.0-alpha.5"
  },
  "private": true
}

我试图将这些文件与几个自定义JavaScript文件捆绑在一起.为了做到这一点,我有以下Gulp任务:

gulpfile.js

gulp.task('bundleJs', function() {
  var jsFiles = [
    './bower_components/jquery/dist/jquery.min.js',
    './bower_components/tether/dist/tether.min.js',
    './bower_components/bootstrap/dist/js/bootstrap.min.js',
    './public/core.js',
    './public/utils.js'
  ];

  return gulp.src(jsFiles)
    .pipe(concat('bundle.js'))
    .pipe(gulp.dest('./public/js'))
  ;
});

然后,在我的网页中,我正在引用这样的文件:

的index.html

<script type="text/javascript" src="/public/js/bundle.js"></script>

我的网页加载,我可以看到bundle.js已成功加载.但是,在控制台窗口中,我看到以下错误:

未捕获的错误:Bootstrap工具提示需要Tether

我相信这就是为什么我的汉堡菜单不再适用于手机.我的问题是,有没有办法将这些文件捆绑在一起？或者,我是否需要单独加载每个？

Answer 1

我复制了你的项目。

指向 gulp 文件中的 tether JS 文件的 URL 似乎不正确。

它应该是：

'./bower_components/tether/dist/js/tether.min.js',

代替：

'./bower_components/tether/dist/tether.min.js',