javascript - Twitter bootstrap-jquery-plugins nicht kompiliert für die Produktion

Entwickle ich ein 3.1 Rails-app mit Twitter-Bootstrap mit seyhunak gem.

Auf die Produktion-Modus, ich war in der Lage, die grundlegenden bootstrap CSS-und JS-durch pipeline-Vorkompilierung:

RAILS_ENV=production bundle exec rake assets:precompile

Mit der gem-Datei :

group :assets do
  gem 'sass-rails',   '~> 3.1.5'
  gem 'coffee-rails', '~> 3.1.1'
  gem 'uglifier', '>= 1.0.3'
  gem "twitter-bootstrap-rails"
end

Und die application.js Datei:

//= require_tree .

//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require bootstrap-tab
//= require bootstrap-modal
//= require bootstrap-dropdown
//= require bootstrap-popover

Die Anwendung funktionierte gut, außer für die bootstrap-plugins wie modals und dropdowns. Diese plugins vorhanden sind als statische javascript-Bibliotheken vorhandenen Innenseite der Verkäufer assets Verzeichnis:

/vendor/assets/javascripts/bootstrap-dropdown.js
...

Ich bin mir nicht sicher, ob diese Dateien werden vorkompilierte oder nicht, wie kann ich verwalten können, dies zu tun?

InformationsquelleAutor al-Amjad Tawfiq Isstaif | 2012-04-20
  1. 8

    Gefunden!

    War es nicht ein problem von bootstrap -, sondern mit richtig vorkompilieren jQuery. Sowie es gibt keine Notwendigkeit für das einbinden der javascript-Dateien für die einzelnen plugins. Sie sind bereits im Haupt-twitter/bootstrap.

    Problem wurde gelöst, indem re-arrangieren die javascript-Dateien wie folgt:

    application.js

    //= require jquery
//= require jquery_ujs
//= require twitter/bootstrap

    Gemfile

    group :assets do
  gem 'sass-rails',   '~> 3.1.5'
  gem 'coffee-rails', '~> 3.1.1'
  gem 'uglifier', '>= 1.0.3'
  gem "twitter-bootstrap-rails"
end

gem 'jquery-rails', '>= 1.0.12'

    Precompling die Vermögenswerte und gearbeitet!

    • Das war nicht gerade die Lösung, die für mich gearbeitet, aber es hat mich in die richtige Richtung gehen. Dank
    • Bitte sagen Sie mir wie Sie Tat...
    InformationsquelleAutor al-Amjad Tawfiq Isstaif
  2. 1

    In Ihrem /vendor/assets/javascripts eine Datei vendor_js.js mit folgendem Inhalt:

    //= require_tree .

    Nun in Ihrem /app/assets/javascripts/application.js auch eine Linie

    //= require vendor_js

    Können Sie anpassen, die vendor_js.js nur auf spezifische Anbieter-plugins, z.B. durch die Verwendung von //= require bootstrap-dropdown sind nur die bootstrap-Dropdown-Listen innerhalb der Verkäufer-javascripts-Verzeichnis.

    AKTUALISIERT, UM KOMMENTARE

    Da Sie den bootstrap-JS-Dateien in Verkäufer/javascripts manuell, entfernen Sie bitte alle bootstrap-bezogene requires von Ihr application.js und fügen Sie Sie in vendor_js.js wie oben angemerkt. Stellen Sie sicher, dass Sie den richtigen Weg (falls Sie die Dateien in ein Unterverzeichnis). Auch stellen Sie sicher, dass jede Datei separat und Ort der Aufnahme der tooltip vor dem popover, da popover hängt davon ab, tooltip geladen werden ersten.

    • Ich habe versucht auf diese Weise, und es funktionierte in der Entwicklung Modus, vorkompilierte das Vermögen wieder und die plugins und andere Sachen immer noch nicht in der Produktion Modus 🙁
    • Könnten Sie überprüfen, ob die Vermögenswerte sind vorkompilierte richtig, also der Datei-hash wird an den Dateinamen angehängt? In der Theorie, Sie sollten. Wenn Sie sind, dann könnte es ein anderes problem, z.B. namespace clashes etc. Ich habe nicht mit twitter-bootstrap-rails - aber sind Sie sicher, dass die gem geht in den "assets" - Gruppe? Auch, wie kamst du auf die 2 bestimmte plugins in das vendor dir, während andere scheinen in einem anderen Verzeichnis?
    • Es scheint, dass der plugin-code in die vorkompilierte application.js aber aus irgendeinem Grund der browser nicht erkennen, es.
    • Ich betrat die Dateien manuell in die Lieferanten-Datei. Ich habe nicht jetzt eine bessere Möglichkeit der Verwendung des bootstrap-jquery-plugins.
    • Ich habe ja die hash-Dateien, und der Edelstein ist in der Aktiva-Gruppe. Was kann die Ursache namespace clash?
    • Hast du das speichern der bootstrap-js-plugins in vendor? Wenn so, Sie konnten nun doppelt ... Bitte entfernen Sie alle bootstrap-bezogenen Zeilen aus Ihrem application.js. Außerdem denke ich, dass der tooltip aufgenommen werden müssen, bevor popover - also statt require_tree . Sie vielleicht erklären müssen jede Datei einzeln in die vendor.js; und achten Sie auf die Reihenfolge der includes
    • Tut mir Leid zu sagen, dass ich bereits getan habe, was Sie sagte, aber noch plugins, die nicht in der Produktion. Ich denke, es ist ein problem in der Weise javascripts vorkompiliert.
    • Nur ein wichtiger Hinweis: die app ist in Ordnung, die während der Entwicklung Modus.
    • Was genau bedeutet "funktioniert nicht" bedeutet? Erhalten Sie JS Ausnahmen in der browser-Konsole (z.B. Chrome oder Firebug)? Bitte mehr Informationen in deine Frage und vielleicht wollen Sie auch den Titel zu ändern - das wird anderen helfen, Sie unterstützen so gut.
    • Danke, dass Sie so viel blackbird07, ich habe das problem gelöst. Ich werde warten, für eine weitere Stunde Einreichen 🙂

    InformationsquelleAutor emrass
Schreibe einen Kommentar