RequireJS, çoklu sayfalar ve kısmi görünümlerle nasıl çalışır?

RequireJS'a bakıyorum ama bazı şeylerden emin değilim.RequireJS, çoklu sayfalar ve kısmi görünümlerle nasıl çalışır?

Tüm bağımlılıklarımı main.js ile nasıl yükleyebileceğimi anlıyorum. main.js'da bu bağımlılıklarla çalışmak için herhangi bir mantık eklemem gerekir mi?

Bana göre, main.js bir document.ready durumuna benziyor ve belge yüklendiğinde oraya mantık giriyorsunuz, değil mi?

Diğer sayfalar ve kısmi görünümler için, birden çok main.js oluşturmam gerekir mi, yoksa yalnızca bağımlı fonksiyonlardaki bağımlılıkları <script>'daki görünümlerden alabilir miyim?

kaynak

2012-05-30 Johan Alkstål

Güncelleştirme - Modem HTML bileşenleri ile RequireJS kullanarak bir örnek ekledim. aracı örneği dahil kurmak - https://github.com/simonsmith/modular-html-requirejs

Ben de bu konuda bir blog makale yazdım - http://simonsmith.io/modular-html-components-with-requirejs/

sadece her şey için main.jsprobably more suited to a single page application olduğunu kullanmanın yaklaşım.

Ben bu durumu ele ettik yöntemi nedir

sadece main.js dosyada ortak site genelindeki JS şunlardır: Her sayfada

<script src="require.js" data-main="main"></script>

main.js

page1.html

<script> 
    require(['scripts/page1']); 
</script>

page1.js

require(['jquery', 'page1Module'], function($, module){ 
    // page1 specific stuff here 
});

Yukarıdaki örnek başa çıkacağımızı konuda birkaç yöntem biridir. Not the difference between loading a plain JavaScript file and a module.

benim takip etmeniz gereken bir kural (bu daha kolay kavramsallaştırmamızı yaparsa veya Sınıfları) vb, kendi bağımlılıkları ile define içindeki tüm yeniden kullanılabilir modülleri tutmak ve daha sonra bu modüller kapmak için require kullanın onların yöntemlerini kullanın veya etkileşime etmektir onları bir şekilde.

Bu modelin kullanılması, kesinlikle domReady modülünün that is a separate plugin for RequireJS kullanımını gerektirecektir. Bu instead of a ready function in jQuery'u kullanın, çünkü modüllerin DOM'un hazır olmadan indirilmeye başlamasına izin verir, bu da kodunuzun yürütülmesini beklemeyi azaltır. Sen RequireJS içinde see another example of multi-page application isteyebilirsiniz

Düzenleme

kaynak

2012-05-30 13:10:02

Teşekkür bakın. RequireJS'i şimdi nasıl kullanacağımı daha iyi anladım. –

Yukarıdaki yöntem, sayfalarda mükemmel bir şekilde çalışır, ancak ajax ile yüklenen sayfa div'e çağrıldığında, modüller yüklenmez .. herhangi bir yardım? –

Bu yaklaşım tamamen güvenilir görünmüyor, çünkü satır içi komut dosyası etiketlerindeki kod, main.js'deki koddan önce iyi çalıştırılabilir ve zaman zaman arızalara neden olabilir. İlgili bir soruya [bu yanıtı] (http://stackoverflow.com/a/14345709) bakın. –

Geçenlerde bir ASP.NET MVC uygulamasında otomatik inşa optimizasyonu ile RequrieJS kurma egzersiz yoluyla gitti Repo.Simon'ın büyük bir referansı olan birçok yararlı blog makalesi var. ASP.NET perspektifinden, çok sayfalı ASP.NET uygulamaları için RequireJS optimize edicisini yapılandırma açısından en kullanışlı olanlardan biri Making RequireJS play nice with ASP.NET MVC idi.

Zaten orada büyük bilgiler kullanarak benim kendi ASP.NET MVC RequireJS example on GitHub. İçerilenlerin çoğu, zaten orada bulunan örneklere benzemektedir, ancak kısmi görüşler konusunu ele almak için, ve çoklu sayfa bağımlılıkları gerektiriyor biraz farklı bir yaklaşım benimsedim.

_Layout.cshtml

mevcut örneklerden en belirgin fark, RequrieJS yapılandırma verilerini yanı sıra referans sayfasını belirli bağımlılıkları gerektirir geçmesi için yöntemler sunar özel bir RequireViewPage yaratılmasıdır. ,

<head> 
    ... 
    @RenderModuleConfig() 
    <script type="text/javascript" src="@Url.Script("vendor/require.js")" data-main="main"></script> 
</head> 
<body> 
    ...

Görünümler & Partials

görünümleri kadar Tel için (ve benim dava nakavt görünüm modellerinde):

Yani _Layout.cshtml kadar olan beklediğiniz gibi görünecek

... 
    @RenderSection("scripts", required: false) 
    <script type="text/javascript">require(['main'], function() { require(['lib/knockout/knockout.require']); });</script> 
</body>

Bu işlem ensu aşağıdaki gibi an additional script fragment _Layout.cshtml altına eklendi Herhangi bir görünüm bağımlılığı için ana modül yüklendi (ana için bağımlılıkların main.js'da tanımlandığı varsayılarak veri öznitelikleriyle belirli bağımlılıkların görüntülenmesi sağlandı.

<div data-require="@MainModule"> ... </div> 
<div data-require="@Module("address")"> ... </div> 
<div data-require="view\home\index\model"> ... </div>

tasarım ve tam bir seçenek açıklaması için

, çok iyi yazılmış cevabını README on GitHub

kaynak

2014-02-19 14:25:03

RequireJS, çoklu sayfalar ve kısmi görünümlerle nasıl çalışır?

cevap

İlgili konular