объединить модули requirejs в один файл

Я пытаюсь объединить все мои требуемые модули и несколько текстовых шаблонов в один объединенный и уродливый main.минута.js, поэтому я могу включить этот файл в свой HTML.

я вычислил конкатенацию и уродливую часть. Тем не менее, я не могу запустить какой-либо код в браузере.

Я создал проект голой кости на github, чтобы воспроизвести проблему.

структура:
  • main.js
    • .HTML-код
  • log.js
  • построить-производства
  • lib / require.js
  • node_modules/require/bin/r.js

я объединяю main.js, log.JS и требуют.js с помощью файла сборки build-production:

./node_modules/requirejs/bin/r.js -o build-production.js

main.js

require.config({
    paths: {
        requireLib : 'lib/require/require'
    },
    waitSeconds: 1000
});

console.log('loading main.js');

define(function(require) {
    var log = require('log');
    console.log('loaded')

    log.fine('main loaded');
});

сборки-производства.js:

({
    mainConfigFile : 'main.js',
    include : [ 'requireLib' ],
    name : 'main.js',
    out : 'main.min.js' })
.HTML-код: 
<script src="main.min.js" type="text/javascript"></script>

так индекс.HTML в браузер должен вывести

загрузка main.js
нагруженный загружено main

но он печатает только первую строку

загрузка main.js

кто-нибудь знает, почему это так?

9
javascript requirejs

2 ответов

я только что поближе изучил ваш код.

я не уверен, почему вы загружаете в минифицированный файл через:

<script src="main.min.js" type="text/javascript"></script>

это AMD модуль, следовательно, должен быть загружен с помощью загрузчика AMD (в противном случае define не обрабатывается).

это работает:

<script type="text/javascript" src="lib/require/require.js"></script>
<script type="text/javascript">
    require(['main.min'], function () {
        require(['main'], function () {});
    });
</script>

Edit: в то время как внешний требует нагрузок в минимизированном файле( содержащем все модули), вам также нужен второй, вложенный требуется загрузить фактический модуль, все еще известный как main.

это довольно вводит в заблуждение, имея один модуль с именем main а затем уменьшенная версия всех модулей с именем main.мин. Например, я мог бы ожидать main быть точно таким же, как main.мин, но без каких-либо оптимизаций, применяемых. Вы можете рассмотреть возможность переименования в нечто вроде:

  • точки входа: myApp
  • составлен (optimize: 'none'):main
  • составлен (optimize: 'uglify2'): main.мин

Edit 2: в файле build:

name: 'main.js' → name: 'main'

это сделает requirejs имя этого модуля main вместо:

define('main.js', ...); → define('main', ...);

теперь: require(['main']) находит (и загружает) модуль с именем main в локальная область скомпилированного файла.

перед: require(['main']) не нашел модуль под названием main (он был назван main.js), поэтому воспринимает его как имя файла и загружает ./main.js.

Edit 3: вместо Edit 2 в файле сборки можно сохранить:

name: 'main.js'

и добавьте псевдоним пути к конфигурации сборки или времени выполнения config:

paths: { 'main' : 'main.js' }

(эта случайная мысль приходит без гарантии.)

9

поздно на вечеринку, но я подумал, что это будет полезно для других, которые могут искать аналогичное решение. И я решил разместить здесь документы.

есть еще browserify что делает именно то, что вы ищете. Его использование похоже на требуются (на npm), но вы можете использовать его на стороне браузера. Я нашел это полезным.

0