requirejs optimizer - нужна помощь в оптимизации нашего приложения

У нас есть крупномасштабное приложение javascript, которое мы пытаемся объединить и минимизировать с помощью grunt-contrib-requirejs. Мы используем фреймворк Aura. Мы используем bower для добавления зависимостей из других репозиториев в наше основное приложение.

Вот структура нашего приложения

- app/  
   |  
   |_ main.js  
   |_ index.html  
   |_ css
   |_ bower_components/  
      |_ core/
      |_ widget1/  
          |_ main.js  
          |_ views/  
          |_ models/  
      |_ widget2/  
      |_ extension1/  
      |_ extension2/  
      |_ other third party libraries, etc
- Gruntfile.js
- bower.json

main.js:

requirejs.config({
    shim: {
        ...
    },
    paths: {
       'core': 'bower_components/core/app/main',
       'aura': 'bower_components/aura/dist/',
       'jquery': 'bower_components/jquery/jquery',
       'backbone': ...,
       ... lots of other paths
    }
});
define(['core', 'jquery', 'jqueryui'], function(core, $) {
    // Here we start Aura, which finds our extensions and widgets in
    // bower_components
});  

Наша текущая конфигурация задачи requirejs:

requirejs: {
    compile: {
        options: {
            mainConfigFile: 'app/main.js',
            name: 'main',
            include: ['bower_components/widget1/main', 'bower_components/widget2/main',
                'bower_components/extension1/main', 'bower_components/extension2/main'],
            exclude: ['jquery'],
            insertRequire: ['main'],
            out: 'dist/app.js'
        }
    }
}

Это соответствует нашему app/main и его зависимостям, но когда мы пытаемся запустить его, мы получаем такие ошибки, как:
ПОЛУЧИТЕ http://www.my-machine:8080/bower_components/underscore/underscore.js 404 (не найдено), хотя подчеркивание является зависимостью многих виджетов, которые мы включаем.

Мы тщательно опробовали различные варианты в примерах r.js и прочитали множество проблем с потоком стека, пытаясь найти ответ.
Нам нужен совет о том, как встроить это в один минимизированный файл с такой структурой:

ОБНОВЛЕНИЕ № 2: Правильная структура файла

- dist/  
    |_ index.html // copied using grunt copy
    |_ css        // copied using grunt copy
    |_ app.js     // Built with grunt requirejs

ОБНОВИТЬ
Мы включили underscore в нашей прокладке, которая исправила вышеуказанную ошибку, но мы все еще получаем другую ошибку:

Failed to load resource: the server responded with a status of 404 (Not Found)
http://my-machine.com:8080/bower_components/core/app/main.js  

Это включено в свернутый файл, поэтому я не понимаю, почему он не может найти этот файл:

define("bower_components/core/app/main.js", ["aura/aura", "bootstrap"], function(){
...
});

ОБНОВЛЕНИЕ № 3
Вышеприведенное определение взято из файла, созданного инструментом оптимизации! Исходное определение для этого модуля, core/app/main.js, похоже:

define(['aura', 'bootstrap'], function(Aura) {
    ...
});

2 ответа

Вы упоминаете, что это в вашем оптимизированном файле:

define("bower_components/core/app/main.js", ["aura/aura", "bootstrap"], function(){
...
});

Но это не имеет смысла. Если я воспроизведу структуру, аналогичную той, что вы показываете в своем вопросе, и проведу оптимизацию, то файл, расположенный по адресу bower_components/core/app/main.js оптимизируется как:

define("core", ...

потому что это известно как core в остальной части вашего заявления из-за paths установка 'core': 'bower_components/core/app/main',

Я могу воспроизвести неправильное имя модуля, если я добавлю 'bower_components/core/app/main.js' к include настройка в конфигурации сборки. Когда я добавляю это имя к include список, я также получаю ошибку загрузки, которую вы упомянули. Убедитесь, что ваш include список не содержит это имя, и убедитесь, что нигде нет ничего, что списки 'bower_components/core/app/main.js' как зависимость. Это имя не должно появляться ни в одном define или же require вызов.

Сначала пара соображений:

Прежде всего, вы должны избегать определения модуля с именем. Имя должно генерироваться инструментом оптимизации в обычном режиме. Пожалуйста, прочитайте здесь: http://requirejs.org/docs/api.html

Во-вторых, вы должны понимать, что такое baseUrl и когда он используется для размещения ресурсов. В вашем случае baseUrl выглядит как "app /", хотя вы не определили его явно. Вы также должны прочитать это: http://requirejs.org/docs/api.html Так что если вы используете расширение ".js", то baseUrl не будет учитываться.

Теперь, что вы должны попробовать:

Для начала удалите первый аргумент "bower_components / core / app / main.js" из функции define. Затем вам следует обратиться к этому модулю с помощью автоматически сгенерированного идентификатора модуля, который будет путем относительно baseUrl без расширения ".js".

Другие вопросы по тегам