Browserify 捆绑未定义的依赖项
Browserify bundle undefined dependency
我在 Backbone
项目中使用 browserify
并填充 owlCarousel
因为它不是 commonJS
之类的模块。 shim
转换似乎有效,但在我真正需要它时却无效。
我的 app.js
文件如下所示:
var settingsView = require("./settingsView.js");
new settingsView();
和我的settingsView
var app = require("./controllers.js"),
$ = require("jQuery"),
Backbone = require("Backbone"),
owlCarousel = require("owlCarousel");
Backbone.$ = $;
module.exports = Backbone.View.extend({
el: ".settings",
events: {
"click .carousel-img": "setBackground",
"click .palette div": "setTextColor"
},
options: {
singleItem: true,
pagination: false,
navigation: true,
mouseDrag: false
},
initialize: function () {
this.initCarousel();
},
initCarousel: function () {
/* This is causing the problem */
this.owlCarousel = this.$el.find(".carousel").owlCarousel(this.options);
}
})
我的 package.json
"browser": {
"jquery": "./node_modules/jquery/dist/jquery.js",
"owlCarousel": "./vendor/owl-carousel/owl-carousel/owl.carousel.js"
},
"browserify": {
"transform": [
"browserify-shim"
]
},
"browserify-shim": {
"jquery": "$",
"owlCarousel": {
"depends": ["jquery:$"]
}
}
它给我的错误:
Uncaught TypeError: this.$el.find(...).owlCarousel is not a function
在运行时间。但是,如果我 运行 $("div").owlCarousel
在 dom 准备好后在控制台中,它就可以工作。
我解决了
var app = require("./controllers.js"),
$ = require("jQuery"),
Backbone = require("Backbone"),
owlCarousel = require("owlCarousel");
Backbone.$ = $;
$.fn.owlCarousel = owlCarousel
我在 Backbone
项目中使用 browserify
并填充 owlCarousel
因为它不是 commonJS
之类的模块。 shim
转换似乎有效,但在我真正需要它时却无效。
我的 app.js
文件如下所示:
var settingsView = require("./settingsView.js");
new settingsView();
和我的settingsView
var app = require("./controllers.js"),
$ = require("jQuery"),
Backbone = require("Backbone"),
owlCarousel = require("owlCarousel");
Backbone.$ = $;
module.exports = Backbone.View.extend({
el: ".settings",
events: {
"click .carousel-img": "setBackground",
"click .palette div": "setTextColor"
},
options: {
singleItem: true,
pagination: false,
navigation: true,
mouseDrag: false
},
initialize: function () {
this.initCarousel();
},
initCarousel: function () {
/* This is causing the problem */
this.owlCarousel = this.$el.find(".carousel").owlCarousel(this.options);
}
})
我的 package.json
"browser": {
"jquery": "./node_modules/jquery/dist/jquery.js",
"owlCarousel": "./vendor/owl-carousel/owl-carousel/owl.carousel.js"
},
"browserify": {
"transform": [
"browserify-shim"
]
},
"browserify-shim": {
"jquery": "$",
"owlCarousel": {
"depends": ["jquery:$"]
}
}
它给我的错误:
Uncaught TypeError: this.$el.find(...).owlCarousel is not a function
在运行时间。但是,如果我 运行 $("div").owlCarousel
在 dom 准备好后在控制台中,它就可以工作。
我解决了
var app = require("./controllers.js"),
$ = require("jQuery"),
Backbone = require("Backbone"),
owlCarousel = require("owlCarousel");
Backbone.$ = $;
$.fn.owlCarousel = owlCarousel