2013-12-14 8 views
9

Mam problemy z dostaniem Grunt przeprowadzić optymalizację requirejs nad projektem o następującej strukturze:Grunt & requirejs optymalizator dla wielu aplikacji projektu

static/js 
    |── apps 
     |── app.js 
     |── dash.js 
     |── news.js 
     ... (many more 'app' files) 
    |── build 
    |── collections 
    |── libs 
    |── models 
    |── util 
    |── views 

Każdy static/js/apps/*.js powinien zostać skompilowany do static/js/build/*.js zawierającego odpowiednie zależności (np. views/view1, libs/query itp.).

ten jest obecnie wykonywane przez podstawowego skryptu bash:

JS_ROOT="static/js" 

for f in ${JS_ROOT}/apps/* 
do 
    FILE=$(basename -s .js ${f}) 
    pushd . 
    cd ${JS_ROOT} && r.js -o baseUrl=. name=libs/require-min.js include=apps/${FILE} out=build/${FILE}.js 
    popd 
done 

Ja próbuje przejść do optymalizacji opartej na Grunt, z następujących w Grunt.js:

requirejs: { 
    compile: { 
     options: { 
      appDir: 'static/js/', 
      baseUrl: './apps/', 
      dir: 'static/js/build/', 
      modules: [ 
       { 
        name: 'app', 
       } 
      ] 
     } 
    } 
} 

Bieg generuje następujący błąd:

>> Tracing dependencies for: app 
>> Error: ENOENT, no such file or directory 
>> 'static/js/build/apps/libs/jquery.js' 
>> In module tree: 
>>  app 

Mogę wyraźnie zobaczyć, co jest problem, ale jestem braku dowiedzieć się, jak się wskazywać, że w zależności każdego pliku static/js/apps/*.js są w static/js/ nie static/js/build

oprócz tego, jestem przy założeniu, że blok modules zawierający name: 'app' należy wyprowadzanie skompilowany plik static/js/build/app.js z zawartości static/js/apps/app.js.

Bez tworzenia dodatkowego bloku module dla każdego pliku w static/js/apps, w jaki sposób mogę skompilować każdy z plików w ich odpowiedni plik static/js/build/*.js?

Update 1

Więc po moim Gruntfile kompiluje static/js/apps/app.js powodzeniem w static/js/build/app.js:

requirejs: { 
    compile: { 
     options: { 
      baseUrl: 'static/js/', 
      include: './apps/app.js', 
      out: 'static/js/build/app.js', 
     } 
    } 
} 

Następnym krokiem jest do kompilacji static/js/apps/*.js w static/js/build/*.js bez konieczności definiowania każdy indywidualnie ...

Aktualizacja 2

Modyfikowanie wyżej:

requirejs: { 
    compile: { 
     options: { 
      baseUrl: '../', 
      include: './apps/<%= appFile %>', 
      out: 'static/js/build/<%= appFile %>', 
     } 
    } 
} 

i tworzenie zadania:

grunt.registerTask('buildrjs', function() { 
    var dir='static/js/apps/'; 
    grunt.file.setBase(dir); 
    var files = grunt.file.expand(['*.js']); 
    files.forEach(function(filename) { 
     grunt.log.write('Compiling '+filename+'\n'); 
     grunt.config.set('appFile', filename); 
     grunt.task.run('requirejs:compile'); 
    }); 
}); 

Prawie dostaje mnie do roztworu. Zadania są uruchamiane przez każdy plik pod numerem static/js/apps/ i przekazują nazwę pliku do grunt.config.set('appFile', filename);. Dane wyjściowe zadania wyjściowego są następujące: Compiling app.js Compiling news.js... itd., Ale potem rzeczywiste zadania requirejs:compile są uruchamiane ponad & na ostatnim pliku w katalogu static/js/apps/, a nie na każdym pojedynczym pliku. Problem asynchroniczny?

Odpowiedz

11

rozwiązany, przekazując wiele zestawów opcji do zadania requirejs, dzięki this article dla ostatecznych wskaźników Potrzebowałem:

module.exports = function(grunt) { 
    var files = grunt.file.expand('static/js/apps/*.js'); 
    var requirejsOptions = {}; 

    files.forEach(function(file) { 
     var filename = file.split('/').pop(); 
     requirejsOptions[filename] = { 
      options: { 
       baseUrl: 'static/js/', 
       include: './apps/'+filename, 
       out: 'static/js/build/'+filename 
      } 
     }; 
    }); 

    grunt.initConfig({ 
     pkg: grunt.file.readJSON('package.json'), 
     requirejs: requirejsOptions, 
    }); 
}; 

Następnie zadaniem ['requirejs'] mogą być uruchamiane jako normalne i wyjście z pliku odpowiednich zebrane js według każdego z options: {} bloków, które zostały określone w requirejsOptions, np

grunt.registerTask('default', ['requirejs']);

0

Musisz zmienić baseURL do statyczne/js z aplikacji w requirejs zbudować config.Ponieważ obecnie baseUrl wskazuje na katalog apps, require próbuje przeszukać pliki zależności w katalogu apps. Jeśli zmienisz baseUrl na static/js, odnajdziesz te pliki zależności.

requirejs: { 
    compile: { 
     options: { 
     appDir: 'static/js/', 
     baseUrl: 'static/js', 
     dir: 'static/js/build/', 
     modules: [ 
      { 
       name: 'app', 
      } 
     ] 
     } 
    } 
    } 
+0

Ale 'baseUrl' jest względne do' appDir', więc podczas ładowania modułu 'app' moduł requirejs będzie szukał w'/static/js/static/js/app.js'. –

+0

Przepraszam, że przegapiłem ten punkt. Następnie możesz zmienić BaseUrl na __.__ baseUrl: "." – shree33

+0

Dzięki. W tym przypadku jednak 'moduł' będzie wymagał aktualizacji do' name: 'apps/app''. Powoduje to, że cała zawartość 'static/js' jest kopiowana do' static/js/build'. –