Вложение текста require.js! используя Grunt

Я экспериментировал с Grunt и требовал JS сегодня днем. Я большой поклонник модуля text и использую его для создания моих шаблонов. В проектах, не связанных с Grunt, я использовал опции inlineText и stubModules Require JS для вставки файлов шаблонов, и он отлично работает. Тем не менее, у меня возникли проблемы с работой с Grunt.

Требовать конфигурацию

require.config({
    paths: {
        // Using Bower for dependency management
        text: '../components/requirejs-text/text'
    }
});

Использование

define(['text!template.html'], function (html) {
    // Do stuff with html
});

Gruntfile.js

requirejs: {
    dist: {
        options: {
            baseUrl: 'app/scripts',
            optimize: 'none',
            preserveLicenseComments: false,
            useStrict: true,
            wrap: true,
            inlineText: true,
            stubModules: ['text']
        }
    }
}

После запуска grunt я получаю различные ошибки в консоли:

  • Файл не найден на /dist/components/requirejs-text/text.js
  • A Load timeout for modules: text!template.html_unnormalized2

Два вопроса:

  • Кажется, что это не инкрустировать (а затем и заглушить) код text.js
  • Кажется, он не вставляет файл template.html

Любые идеи, почему он не работает?

Ответы

Ответ 1

Вы видите ошибку, потому что вам нужно указать r.js, где находится модуль text.

Вы можете сделать это, добавив конфигурацию путей:

requirejs: {
    dist: {
        options: {
          baseUrl: 'app/scripts',
          optimize: 'none',
          preserveLicenseComments: false,
          useStrict: true,
          wrap: true,
          inlineText: true,
          stubModules: ['text'],
          paths: {
             'text': 'libs/text' // relative to baseUrl
          }
       }
    }
}

Затем вам нужно загрузить модуль text.js в соответствующий каталог.

Но почему ваш require.config не работает?

Поскольку r.js необходимо оценить конфигурацию в какой-то момент. Вы не упомянули в вопросе, где находится ваш require.config, но в случае, если вы хотите его оценить, вам нужно указать, где находится r.js (см. https://github.com/jrburke/r.js/blob/master/build/example.build.js#L35):

requirejs: {
    dist: {
        options: {
          baseUrl: 'app/scripts',
          optimize: 'none',
          preserveLicenseComments: false,
          useStrict: true,
          wrap: true,
          inlineText: true,
          stubModules: ['text'],
          mainConfigFile: '../config.js' // here is your require.config

          // Optionally you can use paths to override the configuration
          paths: {
             'text': 'libs/text' // relative to baseUrl
          }
       }
    }
}