2015-08-18 26 views
5

Webpack ve Angular ile nw.js uygulaması yapıyorum. Bu uçak plakası https://github.com/jakemmarsh/angularjs-gulp-browserify-boilerplate'dan diğer düzlemsel açısal uygulamasında gördüğüm ve kullandığım bir şeyi elde etmek istiyorum.Toplu ihtiyaç gerektiren uygulamalar için Webpack'in alternatifi

Aşağıdaki kod, & modülleri kuruluşuna hizmet vermektedir ve harika bir iş çıkarmaktadır. Her modülde içeren bir _index.js dosya varsa aşağıdaki:

var bulk = require('bulk-require'); 
module.exports = angular.module('app.services', []); 
bulk(__dirname, ['./**/!(*_index|*.spec).js']); 

Bu kullanmadan açısal modülü ihraç ve sonra her dosya sadece gerektiriyorsa aynı dizinde ve devam eder (oldukça emin değil ama muhtemelen gerektiren bir) aynı dizinde olması gerekmez:

var app = require('./_index'); 
app.controller('SomeCtrl', function...); 

Şimdi WebPack uygulanması için ben bu örneği this ayarlama denedim:

require.context("..", true, /^grunt-[^\/]+\/tasks/[^\/]+$/); 

ve bu benim regex doğru orada uygulanmaz eminim, o yüzden bu işi yapmak için nasıl yardımına ihtiyacım bunun

require.context(__dirname, true, /./**/!(*_index|*.spec).js/); 

benim sürümüdür.

Diğer taraftan, kazan plakasının topluca ihtiyaç duyduğu işlevlerden ve tam olarak ne yaptığından emin değilim. Tüm dosyaların bir şekilde içerdiğine inanıyorum, çünkü aksi halde uygulamanın başka bir kısmı bunları bilmeyecek. Yani, her yönerge, servis ve denetleyiciyi manuel olarak dahil etmek yerine, bu işi sizin için yaptığını söyleyebilirim. çok

cevap

2

SOLVED.

Bu page çözümünü kullanarak ve biraz uyarladı[email protected] User3335966 tarafından sağlanan regex zaten ben dışlamak anlamına dosyayı, ancak sayesinde döndü :)

/(\w*\/)*(\w*_index|\w*\.spec)\.js/

fikri tüm klasör ve alt klasörler dosyaları değil _index.js dahil etmekti.

Bu regex ancak her .js dosyasını dönmek yapar:

ben regex bilmiyorum yana, ben bir sonucu olarak buna sahip fonksiyonunda _index.js hariç sona erdi

/^(.*\.(js$))[^.]*$/igm

:

var req = require.context("./", true, /^(.*\.(js$))[^.]*$/igm); 
req.keys().forEach(function(key){ 
    if (key !== './_index.js') { 
     req(key); 
    } 
}); 

Yani şimdi ben temelde bu yapın:

module.exports = angular.module('app.homeModule', []); 

var req = require.context("./", true, /^(.*\.(js$))[^.]*$/igm); 
req.keys().forEach(function(key){ 
    if (key !== './_index.js') { 
     req(key); 
    } 
}); 

Bu şekilde bir açısal modül tanımladım ve bu klasördeki diğer tüm dosyaların (denetleyiciler, hizmetler, yönergeler) kullanılabilir olmasını sağlarım.

Herkesin normal ifadedeki dışlamayı nasıl yapacağı konusunda bir fikri varsa memnun olurum.

0

Emin değilim ve yanlış olabilir, ama bu yanlış kullanım gibi regex * niceleyici bakar ve karakterleri / ve . kaçmamış :) yükümlü

Yardım; Gereksiz niceleyiciyi /, *, ( ve |; Sen alışkanlık "sıfır veya daha çok kez herhangi bir karakter" alırsanız
, Böyle .*
şey kullanmalıdır:

/\.\/.*\/!(.*_index|.*\.spec)\.js/ 

Ayrıca Sen \w kullanabilirsiniz - (yerine .) herhangi bir alfanümerik karakterler;

/\.\/\w*\/!(\w*_index|\w*.spec)\.js/ 

Ayrıca ben Sen ne anlama geldiğini anlamak dnt zaman kullanımı !;

Bu örnek aaa/bbb/ccc/blabla_index.js & aaa/bbb/ccc/blabla.spec.js gibi dizeleri bulmak: Bu size yardımcı olacağını umuyoruz

/(\w*\/)*(\w*_index|\w*\.spec)\.js/ 

;

+0

Bundan sonra deneyeceğim. Regex @ user3335966 ile yardım için teşekkürler :) –

0

ElectronJS'deki Açısal proje uygulamam için, dizin ağacındaki tüm dosyaların bir kalıp gibi desene ihtiyaç duyması için küçük bir webpack yükleyici yazdım.

Modül gerektirmek için kullanıyorum. js dosyası için Örnek:

//@require "./**/index.js" 

tüm modül bağımlılığı (js, şablon önbelleği için html, resimler) gerektirecek şekilde kullanabilirsiniz. js dosyası için Örnek:

//@require "./**/!(index|config|run)*" 

Ve css için kullanabilirsiniz. css dosyası için Örnek:

@require "./**/!(app|bootstrap).css"; 

Projemde başarıyla kullanıyoruz. Belki başka biri hayatı kolaylaştırır. https://www.npmjs.com/package/required-loader

İlgili konular