11

今天下午我一直在试验 Grunt 和 Require JS。我是该模块的忠实粉丝，text并使用它来引入我的模板。在非基于 Grunt 的项目中，我使用inlineText和stubModulesRequire 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
  • 一个Load timeout for modules: text!template.html_unnormalized2

那么两个问题：

  • 它似乎没有内联（然后存根）text.js代码
  • 它似乎没有内联template.html文件

任何想法为什么它不起作用？

4

1 回答 1

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. example.build.js#L35）：r.js

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
          }
       }
    }
}
于 2013-09-14T18:31:48.993 回答