ここで説明する検索機能を自分の Jekyll サイトに実装していますが、動作させるには 6 つの個別の JavaScript ファイルが必要なので、RequireJS を使用してこれらすべてのファイルを依存関係としてロードしたいと考えています。物事が機能せず、エラー コンソール メッセージが異なる結果を生成します。
Webkit は言い
Uncaught ReferenceError: Mustache is not defined
ます。jquery.lunr.search.js
依存関係としてリストされている最後の JS ファイルであるメッセージを送信しているファイル。Firefox と Opera は、2 つの別々のファイル (
SecondLevelDomains.js
とIPv6.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
});
});
何か案は?ありがとう!