Etrafta AMD/RequireJS ile oynadıktan sonra Eğer web sayfasından tamamen bağımsız yani şablonlar ve CSS dahil UI modülleri yüklemek için iyi bir fikir olup olmadığını merak ediyordum.

İyi gibi görünüyor, ama bu tuzaklar olabilir yani vahşi hayata görmedim.

Aşağıdaki yapıda bazı kullanıcı arabirimi modülü

myWidget
    |--img 
    |--main.js
    |--styles.css
     --template.tpl

Bir klasördeki tüm şeyler. Çok hoş görünüyor.

Main.js modül bu gibi bir şey olacaktır

define(["TemplateEngine", "text!myWidget/template.tpl"], function(TemplateEngine, template) {

    // Load CSS (Pseudo Code)
    var cssUrl = "myWidget/styles.css";
    appendToHead(cssUrl);

    return function() {
        return {
            render: function(data) {
                  return TemplateEngine.toHtml(template, data);
            } 
        }
    }
});

Soru şu:

1. Bir şey mi kaçırdım?
2. Bir "" yol mu? standart bunu başarmak için nasıl/kavramlar eklentiler var mı
3. Bu RequireJS CSS bölümünü burada işlemek mümkün iyimserlik, herhangi bir parametre/küçült gibi stil JS parçaları ile diyor bu duruma?
4. Bu konuda herhangi bir görüş? İyi ya da kötü?

Bir bağımlılık metni kullanarak şablon belirleyin! görüldüğü gibi modül. Bıyık Şablonları ile yapıyoruz.

Ancak Require.js açıkça css dosyaları desteklemiyor.

İşte resmi açıklama, çok iyi bir açıklaması var: http://requirejs.org/docs/faq-advanced.html#css

Düzenleme: Şubat 2012.

Gidon gibi şablonları da ve diğer JS modülü gibi önceden derlenmiş eklenebilir http://handlebarsjs.com/precompilation.html

Düzenleme: Ağustos 2015

Eğer yazılım bölümleme bu tür sonra eğer webpack css-loader özellikle içine bakmak gerekir. Bu çift için kullanıyorum .css ile dosyaları .jsx dosya birleştirilmiş "" ve inşa aynı anda tek bir stil içine. ilgili CSS özü modülü olarak