2013-04-29 6 views
5

Chcę ładować modernizr synchronicznie w głowicy, aby zapobiec fouc. Używam require.js przed/body, aby załadować inne skrypty, w których chciałbym użyć modernizr do wykrywania cech i tego typu rzeczy.Załaduj modernizator w głowicy, ale użyj go w require.js

Co to jest właściwy sposób, czy jest to zalecane? Jeśli wymagam modernizatora w moich skryptach, zostanie on ponownie wczytany, jeśli nie, będzie niezdefiniowany.

Z góry dziękuję. :)

Odpowiedz

9

Jeśli modernizr jest 1 skrypt ładowany w głowę, a następnie jest ona dostępna z każdego miejsca, dzięki czemu można zdefiniować prosty wrapper tak:

define('modernizr', function() { return window.Modernizr }); 

Kod ten można umieścić wewnątrz wrappers.js tak:

<head> 
<script src="/js/vendor/modernizr.js"></script> 
<script src="/js/vendor/require.js"></script> 
<script src="/js/wrappers.js"></script> 
<script src="/js/main.js"></script> 
</head> 

Następnie w main.js

var scripts = document.getElementsByTagName('script') 
    , src = scripts[scripts.length - 1].src 
    , baseUrl = src.substring(src.indexOf(document.location.pathname), src.lastIndexOf('/')) 

require.config({ 
    baseUrl: baseUrl 
}) 
+0

byś zdefiniował to w zaledwie po wymagają config d eklacja? A może masz coś takiego jak plik wrappers.js i masz wiele tych małych definicji? Mogłem zobaczyć tu za każdym razem, gdy chcesz zwrócić coś z obiektu okna. Specjalnie do testowania można by naprawdę wyśmiewać globalny obiekt naprawdę łatwo. – Neil

+0

Dla pytania operacyjnego umieściłbym go zaraz po wymaganiu config w pliku main.js określonym w atrybucie "data-main", który jest ładowany automatycznie przez requirejs. Ale jeśli chcesz umieścić go w osobnym pliku, to te skrypty powinny być załadowane we właściwej kolejności, a main.js powinien zdefiniować baseUrl. –

+0

Zawarte w main.js i działa jak czar :) – shapeshifta