2013-03-03 5 views
11

Mam motyw Bootstrap z https://wrapbootstrap.com/, który chcę użyć w mojej aplikacji MeteorJS. Problem polega na tym, że ma znaczniki skryptów, takie jak:Dodaj szablon Bootstrap do MeteorJS

<!--[if !lte IE 6]><!--> 
    <!-- Link to Google CDN's jQuery + jQueryUI; fall back to local --> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script> 
    <script>window.jQuery || document.write('<script src="js/libs/jquery.min.js"><\/script>')</script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
    <script>window.jQuery.ui || document.write('<script src="js/libs/jquery.ui.min.js"><\/script>')</script> 

    script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></scrip> 
                        <!-- RECOMMENDED: For (IE6 - IE8) CSS3 pseudo-classes and attribute selectors --> 
    <!--[if lt IE 9]> 
     <script src="js/include/selectivizr.min.js"></script>     
    <![endif]--> 

    <script src="js/libs/jquery.ui.touch-punch.min.js"></script>    <!-- REQUIRED: A small hack that enables the use of touch events on mobile --> 

, które nie działają po dodaniu do MeteorJS. Wiem, że tagi nie działają, ale jak byś mógł umieścić tę zaprojektowaną stronę w MeteorJS?

Później edit:

dodałem script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script> powyżej. Wszystkie powyższe skrypty są dodawane do <body>. Biblioteka google.maps jest używana w lib/main.js i nie działa z MeteorJS, ponieważ podnosi ona ReferenceError. Poza Meteorem działa dobrze.

Jakieś pomysły na dodanie skryptu Google Maps z szablonu Bootstrap?

Później edit:

Bootstrap szablon ma plik lib/main.js który jest ostatni plik JavaScript importowane. Niemniej jednak, kiedy dodaję go do Meteora, wydaje się działać, ale jego efekty nie są widoczne w interfejsie użytkownika. Na przykład uruchamia tę linię $(".chzn-select").select2();, ale tylko gdy wykonuję ją z konsoli, widzę zmiany interfejsu użytkownika. Ten plik jest załadowany jako ostatni przez Meteor. Próbowałem również z niezawierającym

function load_scripts() { 
var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    script.src = "lib/main.js"; 
    document.body.appendChild(script); 
} 

if (Meteor.is_client) { 
    window.onload = load_scripts; 
} 

.

Odpowiedz

7

te motywy zewnętrzne może nie być zgodna z domyślnym bootstrap dołączone meteor, więc należy usunąć bootstrap pakiet Meteor to:

Usuń domyślne bootstrap:

meteor remove bootstrap 

Dodaj swój temat:

Umieść pliki css w katalogu css projektu, na przykład /client/css

Place tematy javascript pliki w /client/lib

nie martw się o znaczniki skryptów lub łączące każdy z nich lub cokolwiek, meteor powinien dbać o wszystko.

także

Meteor to JQuery domyślnie, więc nie trzeba się martwić o włączenie go w swoim projekcie. Aby dodać jQuery jeśli z jakiegoś dziwnego powodu jesteś projekt meteor może nie mieć go używać:

meteor add jquery 

Apis zewnętrzne

np FB/Google Mapis API/skrypty śledzące. Dodaj je tak jak zwykle w sekcji <head> pliku html.

Mam nadzieję, że znajdziesz to wszystko w porządku !!

+0

Uważam, że to naprawdę fajne :) Dziękuję za odpowiedź, częściowo mi pomogło. Teraz utknąłem w skrypcie Google Maps - możesz rzucić okiem na zaktualizowane pytanie. –

+0

Dodaj api google maps w sekcji '' w pliku html – Akshat

+0

Dziękuję, Akshat! –