Я получаю следующую ошибку.
toastr.js:60 Uncaught (in promise) TypeError: $ is not a function
at getContainer (toastr.js:60)
at notify (toastr.js:215)
at r.error (toastr.js:49)
Однако JQuery был загружен, поэтому я не понимаю, что происходит.
Обновление
Я начинаю понимать, что происходит.
Я локально отредактировал следующий файл в своей папке: project/jspm_packages\npm\toastr@2.1.2\toastr.js
В частности, в строке 470: https://github.com/CodeSeven/toastr/blob/1ef00d723691b563b610077a08539391386826b3/toastr.js#L470
Я прокомментировал старый код и добавил следующее:
}(typeof define === 'function' && define.amd ? define : function (deps, factory) {
/*if (typeof module !== 'undefined' && module.exports) { //Node
module.exports = factory(require('jquery'));
} else {
window.toastr = factory(window.jQuery);
}*/
window.toastr = factory(window.jQuery);
module.exports = factory(window.jQuery);
}));
У меня такое ощущение, что команда require('jquery') вызывала запрос на получение файла, расположенного по адресу dist/jquery.js
Однако этот файл не существовал, поэтому коллега создалпустой файлЭто исправило другие ошибки, но, похоже, это влияет на toastr.Я не эксперт по JS, но похоже, что функция require может создавать локальную версию jquery (основанную на файле dist/js) и затем передавать эту ссылку конструктору / фабрике toastr.
Проблема
Моя проблема заключается в том, что require в toastr ищет файл jquery в dist, который не существует.Есть ли способ создать файл оболочки, который возвращает существующий JQuery в ожидаемом формате?
Я думаю, что оболочка должна быть в формате AMD ...
Содержимое package.json
{
"name": "mbak-ui",
"version": "0.5.0",
"description": "mbak",
"keywords": [
"mbak"
],
"main": "dist/main.js",
"repository": {
"type": "git",
"url": "https://MYREPO"
},
"scripts": {
"test": "gulp test",
"e2e": "gulp serve webdriver-standalone e2e"
},
"devDependencies": {
"aurelia-bundler": "^0.4.0",
"aurelia-protractor-plugin": "^1.0.0",
"aurelia-tools": "^1.0.0",
"babel-core": "^6.18.2",
"babel-eslint": "^7.1.0",
"babel-plugin-istanbul": "^2.0.3",
"babel-plugin-syntax-flow": "^6.18.0",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-flow-strip-types": "^6.18.0",
"babel-preset-es2015": "^6.18.0",
"babel-preset-stage-1": "^6.16.0",
"browser-sync": "^2.17.5",
"conventional-changelog": "1.1.0",
"del": "^2.2.2",
"gulp": "^3.9.1",
"gulp-babel": "^6.1.2",
"gulp-bump": "^2.5.0",
"gulp-changed": "^1.3.2",
"gulp-eslint": "^3.0.1",
"gulp-htmlmin": "^3.0.0",
"gulp-notify": "^2.2.0",
"gulp-plumber": "^1.1.0",
"gulp-protractor": "3.0.0",
"gulp-sourcemaps": "^2.2.0",
"http-proxy-middleware": "^0.17.4",
"jasmine-core": "^2.5.2",
"karma": "^1.3.0",
"karma-babel-preprocessor": "^6.0.1",
"karma-chrome-launcher": "^2.0.0",
"karma-coverage": "^1.1.1",
"karma-jasmine": "^1.0.2",
"karma-jspm": "2.2.0",
"merge-stream": "^1.0.1",
"object.assign": "^4.0.4",
"protractor": "^4.0.10",
"proxy-middleware": "^0.15.0",
"require-dir": "^0.3.2",
"requireg": "^0.1.7",
"run-sequence": "^1.2.2",
"vinyl-paths": "^2.1.0",
"yargs": "^6.3.0"
},
"jspm": {
"dependencies": {
"aurelia-animator-css": "npm:aurelia-animator-css@^1.0.0",
"aurelia-binding": "npm:aurelia-binding@^1.2.1",
"aurelia-bootstrapper": "npm:aurelia-bootstrapper@^1.0.0",
"aurelia-dialog": "npm:aurelia-dialog@^1.0.0-rc.1.0.3",
"aurelia-event-aggregator": "npm:aurelia-event-aggregator@^1.0.0",
"aurelia-fetch-client": "npm:aurelia-fetch-client@^1.0.0",
"aurelia-framework": "npm:aurelia-framework@^1.0.0",
"aurelia-history-browser": "npm:aurelia-history-browser@^1.0.0",
"aurelia-http-client": "npm:aurelia-http-client@^1.0.0",
"aurelia-loader-default": "npm:aurelia-loader-default@^1.0.0",
"aurelia-logging-console": "npm:aurelia-logging-console@^1.0.0",
"aurelia-pal-browser": "npm:aurelia-pal-browser@^1.0.0",
"aurelia-polyfills": "npm:aurelia-polyfills@^1.0.0",
"aurelia-router": "npm:aurelia-router@^1.0.7",
"aurelia-templating-binding": "npm:aurelia-templating-binding@^1.0.0",
"aurelia-templating-resources": "npm:aurelia-templating-resources@^1.0.0",
"aurelia-templating-router": "npm:aurelia-templating-router@^1.0.0",
"aurelia-testing": "npm:aurelia-testing@^1.0.0-beta.2.0.1",
"aurelia-validation": "npm:aurelia-validation@^1.0.0",
"aurelia-view-manager": "npm:aurelia-view-manager@^0.1.0",
"css": "github:systemjs/plugin-css@^0.1.35",
"fetch": "github:github/fetch@^2.0.3",
"i18next-xhr-backend": "npm:i18next-xhr-backend@^1.4.2",
"moment": "npm:moment@^2.18.1",
"select2": "github:select2/select2@^4.0.3",
"text": "github:systemjs/plugin-text@^0.0.11",
"zui": "MBAKnet:mbak@alpha"
},
"devDependencies": {
"babel": "npm:babel-core@^5.8.24",
"babel-runtime": "npm:babel-runtime@^5.8.24",
"core-js": "npm:core-js@^1.1.4"
},
"overrides": {
"github:select2/select2@4.0.3": {
"shim": {
"select2": [
"jquery"
]
},
"dependencies": {
"jquery": "jspm:jquery@*"
}
}
}
},
"dependencies": {}
}
Содержимое config.js
https://gist.github.com/menelaosbgr/94d64c03fd8f010688fb9424b63f36c5
Решение
Я нашел ответ и опубликовал его.Мне просто нужно было установить jquery как jquery (в проект):
jspm install jquery=jquery