bootstrap-star-rating插件导致错误：未捕获TypeError：$（...）。rating不是函数

Question

我已经通过bower安装了plugin并将其包含在bower.json文件中：bower install bootstrap-star-rating --save。在视图中（它是一个Rails项目）我有这段代码：

<%= form.text_field :rating,
                            id: :review_rating,
                            class: 'form-item large-6 cell',
                            placeholder: 'Rating*',
                            required: true %>

我的js由gulp编译成public/layout，它出现在application.js中。在config/application.rb我有这段代码：

config.assets.paths << Rails.root.join('public', 'layout')

因此，layout目录存在于资产管道中。  我用来初始化星级的代码是：

$('#review_rating').rating({
        min: 1,
        max: 5,
        step: 1,
        size: 'sm',
        theme: 'krajee-uni'
    });

为什么我收到错误：Uncaught TypeError: $(...).rating is not a function，如果插件在bower.json中作为依赖项存在？

Answer 1

触发错误的函数出现在 bootstrap star-rating github存储库的行498

$.fn.rating = function (option) {
    var args = Array.apply(null, arguments), retvals = [];
    args.shift();
    this.each(function () {
        var self = $(this), data = self.data('rating'), options = typeof option === 'object' && option,
            theme = options.theme || self.data('theme'), lang = options.language || self.data('language') || 'en',
            thm = {}, loc = {}, opts;
        if (!data) {
            if (theme) {
                thm = $.fn.ratingThemes[theme] || {};
            }
            if (lang !== 'en' && !$h.isEmpty($.fn.ratingLocales[lang])) {
                loc = $.fn.ratingLocales[lang];
            }
            opts = $.extend(true, {}, $.fn.rating.defaults, thm, $.fn.ratingLocales.en, loc, options, self.data());
            data = new Rating(this, opts);
            self.data('rating', data);
        }

        if (typeof option === 'string') {
            retvals.push(data[option].apply(data, args));
        }
    });
    switch (retvals.length) {
        case 0:
            return this;
        case 1:
            return retvals[0] === undefined ? this : retvals[0];
        default:
            return retvals;
    }
};

该功能未包含在您的资产管道中。 star-rating.js

中未包含application.js文件

要对此进行测试，只需运行您的服务器rails s，打开您的页面，然后使用f12打开Chrome开发人员工具栏，并在来源部分中搜索该文件。

使用ruby on rails我不会使用bower来安装插件，也许它只是包含所有相关的js，css文件和图像在application.js，.scss内和正确的内部图片文件夹。

https://github.com/kartik-v/bootstrap-star-rating

如果您有任何其他问题，请与我们联系。