javascript - 如何在 Electron 中使用 Bootstrap slider ？

Question

当我使用 Bootstrap slider 时出现以下错误 ( https://github.com/seiyria/bootstrap-slider ) 在我的 Electron( http://electron.atom.io/docs/latest/tutorial/quick-start/ ) 应用程序中:

“未捕获的类型错误:$(...).Slider 不是函数”

早些时候，我也在使用 Jquery 时遇到了困难，但使用以下方法解决了它: https://github.com/atom/electron/issues/254 :

window.$ = window.jQuery = require('/path/to/jquery'); 而不是常规的:

引用的原因是 查询包含以下内容:

if ( typeof module === "object" && typeof module.exports === "object" ) {
  // set jQuery in `module`
} else {
  // set jQuery in `window`
}

我不明白使用它来 Bootstrap slider 的正确方法是什么。

我可以看到 bootstrap-slider.js 有一个处理“模块”的组件，这可能会导致异常，就像在 jquery 中一样。

(function(root, factory) {
    if(typeof define === "function" && define.amd) {
            define(["jquery"], factory);
    } else if(typeof module === "object" && module.exports) {
            var jQuery; 
            try {   
                    jQuery = require("jquery");
            } catch (err) { 
                    jQuery = null; 
            }       
            module.exports = factory(jQuery);
    } else {
            root.Slider = factory(root.jQuery);
    }       

请告诉我如何处理这个问题。

Answer 1

您有 2 个选择:

1. 定期在 index.html 页面中包含 jQuery 和 Bootstrap slider ，并在每个 slider 后面添加一个脚本，以使它们成为全局的，如下所示:

<script src="bower_components/jquery/dist/jquery.js"></script>
<script type="application/javascript">
    if (typeof module === 'object' && typeof module.exports !== 'undefined') {
        window.$ = window.jQuery = module.exports;
    }
</script>
<script src="path/to/bootstrap-slider.js"></script>
<script type="application/javascript">
    if (typeof module === 'object' && typeof module.exports !== 'undefined') {
        window.Slider = module.exports;
    }
</script>

在需要时使用 require 包含 jQuery 和 Slider

var $ = require('jquery');
var Slider = require('bootstrap-slider');