3

我正在为我的 Jekyll 站点实现此处描述的搜索功能,但它需要六个单独的 JavaScript 文件才能工作,因此我想使用 RequireJS 将所​​有这些文件作为依赖项加载。事情不正常,错误控制台消息产生不同的结果。

  • Webkit 说Uncaught ReferenceError: Mustache is not defined。发送消息的文件jquery.lunr.search.js,它是作为依赖项列出的最后一个 JS 文件。

  • Firefox 和 Opera 针对两个单独的文件返回各自版本的控制台错误:SecondLevelDomains.jsIPv6.js.

  • 求IE浏览器。

RE:让 Mustache 和 RequireJS 一起工作,在 SO 上有很多答案,但在这种情况下,它们似乎都不适合我。我正在使用的网站的当前实现可以在这里看到。

更直观的代码表示:

HTML 中的 RequireJS 引用:

<script data-main="/js/config.js" src="/js/require.js" ></script>

网站结构

index.html
js
 |__require.js
 |__config.js
 |__search.js
 |__vendor
   |__date.format.js
   |__jquery.js
   |__jquery.lunr.search.js
   |__lunr.min.js
   |__mustache.js
   |__URI.min.js

config.js看起来像这样:

requirejs.config({
  baseUrl: "/js",

  deps: ["search"],

  paths: {
    jquery: "vendor/jquery",
    lunr: "vendor/lunr.min",
    mustache: "vendor/mustache",
    dateFormat: "vendor/date.format",
    uri: "vendor/URI.min",
    LunrSearch: "vendor/jquery.lunr.search"
  },

  shim: { 
    jquery: {
      exports: 'jquery'
    },
    lunr: {
      exports: 'lunr'
    },
    'mustache': {
      exports: 'Mustache'
    },
    dateFormat: {
      exports: 'dateFormat'
    },
    uri: {
      deps: ['jquery'],
      exports: 'uri'
    },
    LunrSearch: {
      deps: ['jquery', 'mustache'],
      exports: 'LunrSearch'
    }
  }
});

并且search.js(应该启动一切)看起来像这样:

define("search", ["jquery", "lunr", "mustache", "uri", "dateFormat", "LunrSearch"],
  function($, lunr, mustache, dateFormat, uri, LunrSearch) {

    $('#search-query').lunrSearch({
      indexUrl: '/search.json', // URL of the `search.json` index data for your site
      results:  '#search-results', // jQuery selector for the search results container
      entries:  '.entries', // jQuery selector for the element to contain the results list, must be a child of the results element above.
      template: '#search-results-template'  // jQuery selector for the Mustache.js template
  });

});

有任何想法吗?谢谢!

4

0 回答 0