【问题标题】:Inlining require.js text! using Grunt内联 require.js 文本!使用咕噜声
【发布时间】:2013-03-29 19:14:51
【问题描述】:

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

那么两个问题:

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

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

【问题讨论】:

  • 您的文件夹结构是什么样的?执行此操作时,您确定“text.js”在“dist”目录中吗?
  • 我遇到了同样的问题。对我来说,构建工具似乎正在寻找 text.js,因为“文本”一词出现在依赖项 ['text!template.html'] 中。我也在使用需要文本插件。
  • 你用的是哪个 require.js lib for grunt,因为有很多?

标签: javascript build requirejs gruntjs requirejs-text


【解决方案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
          }
       }
    }
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-03-15
    • 2020-03-11
    • 2014-07-25
    • 2015-05-25
    • 2014-02-26
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多