我有两个文件,一个使用另一个文件,在我的情况下autocomplete.js
使用函数timeAgo
。这是自动完成文件:
autocomplete('.search-input', {
templates: {
footer: '<div class="powered-by-algolia"><div class="pull-right"><img src="/imagecache/xs/Algolia_logo_bg-white.jpg" /></div></div>'
}
},
[{
source: autocomplete.sources.hits(players, { hitsPerPage: 5 }),
displayKey: 'first_name',
templates: {
header: '<div class="aa-suggestions-category"><span>Players</span></div>',
suggestion: function(suggestion) {
var birthday = suggestion.birthday;
var birthdayArray = birthday.split('/');
var age = function (birthDay, birthMonth, birthYear) {
todayDate = new Date();
todayYear = todayDate.getFullYear();
todayMonth = todayDate.getMonth();
todayDay = todayDate.getDate();
age = todayYear - birthYear;
if (todayMonth < birthMonth - 1){
age--;
}
if (birthMonth - 1 == todayMonth && todayDay < birthDay){
age--;
}
return age;
}
var old = age(birthdayArray[0], birthdayArray[1], birthdayArray[2]);
return '<span>'
+ '<a href="/player/' + suggestion.id + '/' + suggestion.first_name.toLowerCase() + '-' + suggestion.last_name.toLowerCase() + '">'
+ '<div class="media">'
+ '<div class="media-left">'
+ '<img class="media-object" src="/imagecache/small/' + suggestion.image_filename + '">'
+ '</div>'
+ '<div class="media-body">'
+ '<p>' + suggestion._highlightResult.first_name.value + " " + suggestion._highlightResult.last_name.value + '<small> ' + old + ' years</small>' + '</p>'
+ '<small> ' + suggestion.nationality + ' '+ suggestion.position + '</small>'
+ '</div>'
+ '</div>'
+ '</a>'
+'</span>';
}
}
},
{
source: autocomplete.sources.hits(videos, { hitsPerPage: 5 }),
displayKey: 'title',
templates: {
header: '<div class="aa-suggestions-category"><span>Videos</span></div>',
suggestion: function(suggestion) {
timeAgo();
return '<span>'
+ '<a href="/player/video/' + suggestion.uid + '/' + suggestion.player_name.toLowerCase() + '-' + suggestion.player_surname.toLowerCase() + '">'
+ '<div class="media">'
+ '<img class="d-flex mr-3" src="https://s3.eu-central-1.amazonaws.com/videos.football-talents.com/' + suggestion.video_id + '_1.jpg">'
+ '<div class="media-body">'
+ '<p>' + suggestion._highlightResult.title.value + ' <small class="timeago" title="' + suggestion.created_at + '">' + suggestion.created_at + '</small>' + '</p>'
+ '<small> ' + suggestion._highlightResult.player_name.value + " " + suggestion._highlightResult.player_surname.value + '</small>'
+ '</div>'
+ '</div>'
+ '</a>'
+'</span>';
}
}
}
]).on('autocomplete:updated', function(event, suggestion, dataset) {
var timeagoTimeout;
clearTimeout(timeagoTimeout);
timeAgo();
timeagoTimeout = setTimeout(timeAgo, 60000);
});
这是timeago.js
var timeAgo = function(selector) {
var templates = {
prefix: "",
suffix: " ago",
seconds: "less than a minute",
minute: "about a minute",
minutes: "%d minutes",
hour: "about an hour",
hours: "about %d hours",
day: "a day",
days: "%d days",
month: "about a month",
months: "%d months",
year: "about a year",
years: "%d years"
};
var template = function (t, n) {
return templates[t] && templates[t].replace(/%d/i, Math.abs(Math.round(n)));
};
var timer = function (time) {
if (!time) return;
time = time.replace(/\.\d+/, ""); // remove milliseconds
time = time.replace(/-/, "/").replace(/-/, "/");
time = time.replace(/T/, " ").replace(/Z/, " UTC");
time = time.replace(/([\+\-]\d\d)\:?(\d\d)/, " $1$2"); // -04:00 -> -0400
time = new Date(time * 1000 || time);
var now = new Date();
var seconds = ((now.getTime() - time) * .001) >> 0;
var minutes = seconds / 60;
var hours = minutes / 60;
var days = hours / 24;
var years = days / 365;
return templates.prefix + (
seconds < 45 && template('seconds', seconds) || seconds < 90 && template('minute', 1) || minutes < 45 && template('minutes', minutes) || minutes < 90 && template('hour', 1) || hours < 24 && template('hours', hours) || hours < 42 && template('day', 1) || days < 30 && template('days', days) || days < 45 && template('month', 1) || days < 365 && template('months', days / 30) || years < 1.5 && template('year', 1) || template('years', years)) + templates.suffix;
};
var elements = document.getElementsByClassName('timeago');
for (var i in elements) {
var $this = elements[i];
if (typeof $this === 'object') {
$this.innerHTML = timer($this.getAttribute('title') || $this.getAttribute('datetime'));
}
}
// update time every minute
setTimeout(timeAgo, 60000);
};
如果我在html中导入它们,如下所示,那么一切正常:
<script type="text/javascript" src="{{ asset('js/timeago.js') }}"></script>
<script type="text/javascript" src="{{ asset('js/autocomplete.js') }}"></script>
但是,如果我尝试将它们与app.js中的其他文件捆绑在一起:
require('./bootstrap');
require('./slider');
require('./search-form');
require('./timeago');
require('./autocomplete');
然后,我收到错误:
autocomplete.js?fbbb:20未捕获的ReferenceError:todayDate不是 定义 年龄(eval at(app.js:606),:20:19) 建议(eval at(app.js:606),:37:17) at a(autocomplete.min.js:7) at Object.a.exports.z.map(autocomplete.min.js:6) 在d(autocomplete.min.js:7) 在d._render(autocomplete.min.js:7) 在d.b(autocomplete.min.js:7) 在Object.callback(autocomplete.min.js:7) 在algoliasearch.min.js:3年龄@ autocomplete.js?fbbb:20建议@ autocomplete.js?fbbb:37 a @ autocomplete.min.js:7 a.exports.z.map @ autocomplete.min.js:6 d @ autocomplete.min.js:7 _render @ autocomplete.min.js:7 b @ autocomplete.min.js:7(匿名)@ autocomplete.min.js:7(匿名)@ algoliasearch.min.js:3 setTimeout(async)t.exports @ algoliasearch.min.js:3(匿名)@ algoliasearch.min.js:3 Promise已解决(异步)n._jsonRequest @ algoliasearch.min.js:3 r._search @ algoliasearch.min.js:3(匿名) @ algoliasearch.min.js:3 c @ autocomplete.min.js:7 update @ autocomplete.min.js:7 b @ autocomplete.min.js:7 c @ autocomplete.min.js:6 a.exports.z.each @ autocomplete.min.js:6 f.each @ autocomplete.min.js:6 update @ autocomplete.min.js:7 _onQueryChanged @ autocomplete.min.js:7 d @ autocomplete.min.js:7 h @ autocomplete.min.js:7 _checkInputValue @ autocomplete.min.js:7 _onInput @ autocomplete.min.js:7 f @ autocomplete.min.js:6 d.proxy @ autocomplete.min.js:6 autocomplete.js?fbbb:48未捕获的ReferenceError: timeAgo未定义 在建议中(eval at(app.js:606),:48:7) at a(autocomplete.min.js:7) at Object.a.exports.z.map(autocomplete.min.js:6) 在d(autocomplete.min.js:7) 在d._render(autocomplete.min.js:7) 在d.b(autocomplete.min.js:7) 在Object.callback(autocomplete.min.js:7) 在algoliasearch.min.js:3建议@ autocomplete.js?fbbb:48 a @ autocomplete.min.js:7 a.exports.z.map @ autocomplete.min.js:6 d @ autocomplete.min.js:7 _render @ autocomplete.min.js:7 b @ autocomplete.min.js:7(匿名)@ autocomplete.min.js:7(匿名)@ algoliasearch.min.js:3 setTimeout(async)t.exports @ algoliasearch.min.js:3(匿名)@ algoliasearch.min.js:3 Promise已解决(异步)n._jsonRequest @ algoliasearch.min.js:3 r._search @ algoliasearch.min.js:3(匿名) @ algoliasearch.min.js:3 c @ autocomplete.min.js:7 update @ autocomplete.min.js:7 b @ autocomplete.min.js:7 c @ autocomplete.min.js:6 a.exports.z.each @ autocomplete.min.js:6 f.each @ autocomplete.min.js:6 update @ autocomplete.min.js:7 _onQueryChanged @ autocomplete.min.js:7 d @ autocomplete.min.js:7 h @ autocomplete.min.js:7 _checkInputValue @ autocomplete.min.js:7 _onInput @ autocomplete.min.js:7 f @ autocomplete.min.js:6 d.proxy @ autocomplete.min.js:6 autocomplete.js?fbbb:55未捕获的ReferenceError: timeAgo未定义 在HTMLInputElement.eval(eval at(app.js:606),:55:3) 在HTMLInputElement.d.proxy(autocomplete.min.js:6) 在HTMLInputElement。 (autocomplete.min.js:6) at autocomplete.min.js:6 at p.every() at p.each(autocomplete.min.js:6) at p.a.exports.b.fn.trigger(autocomplete.min.js:6) 在d.trigger(autocomplete.min.js:7) at d._onDatasetRendered(autocomplete.min.js:6) at d(autocomplete.min.js:7)(匿名)@ autocomplete.js?fbbb:55 d.proxy @ autocomplete.min.js:6(匿名)@ autocomplete.min.js:6 (匿名)@ autocomplete.min.js:每个@ autocomplete.min.js:6 a.exports.b.fn.trigger @ autocomplete.min.js:6触发@ autocomplete.min.js:7 _onDatasetRendered @ autocomplete.min.js:6 d @ autocomplete.min.js:7 f.run @ autocomplete.min.js:7 e @ autocomplete.min.js:7 characterData (async)(匿名)@ autocomplete.min.js:7 g @ autocomplete.min.js:7 h @ autocomplete.min.js:7 _onRendered @ autocomplete.min.js:7 d @ autocomplete.min.js:7 h @ autocomplete.min.js:7 clear @ autocomplete.min.js:7 a @ autocomplete.min.js:7 c @ autocomplete.min.js:6 a.exports.z.each @ autocomplete.min.js:6 f.each @ autocomplete.min.js:6 empty @ autocomplete.min.js:7 _onBlurred @ autocomplete.min.js:6 d @ autocomplete.min.js:7 h @ autocomplete.min.js:7 _onBlur @ autocomplete.min.js:7 f @ autocomplete.min.js:6 d.proxy @ autocomplete.min.js:6 autocomplete.js?fbbb:55未捕获的ReferenceError: timeAgo未定义 在HTMLInputElement.eval(eval at(app.js:606),:55:3) 在HTMLInputElement.d.proxy(autocomplete.min.js:6) 在HTMLInputElement。 (autocomplete.min.js:6) at autocomplete.min.js:6 at p.every() at p.each(autocomplete.min.js:6) at p.a.exports.b.fn.trigger(autocomplete.min.js:6) 在d.trigger(autocomplete.min.js:7) at d._onDatasetRendered(autocomplete.min.js:6) 在d(autocomplete.min.js:7)