我正在尝试使用 npm 导入 jQuery 插件(js-offcanvas),但我不断收到相同的错误:
app.js:20: Uncaught TypeError: $(...).offcanvas is not a function
app.js 文件:
import offcanvas from "js-offcanvas"
$('#off-canvas').offcanvas({
// options
});
$( function(){
$(document).trigger("enhance");
});
html文件:
<body>
<div class="c-offcanvas-content-wrap">
...
<a href="#off-canvas" data-offcanvas-trigger="off-canvas">Menu</a>
...
</div>
<aside id="off-canvas"></aside>
</body>
我不确定我是否做错了什么。
更新 这是我的 brunch-config.js 文件:
exports.config = {
// See http://brunch.io/#documentation for docs.
files: {
javascripts: {
joinTo: "js/app.js"
// To use a separate vendor.js bundle, specify two files path
// https://github.com/brunch/brunch/blob/master/docs/config.md#files
// joinTo: {
// "js/app.js": /^(js)/,
// "js/vendor.js": /^(vendor)|(deps)/
// }
//
// To change the order of concatenation of files, explicitly mention here
// https://github.com/brunch/brunch/tree/master/docs#concatenation
// order: {
// before: [
// "vendor/js/jquery-2.1.1.js",
// "vendor/js/bootstrap.min.js"
// ]
// }
},
stylesheets: {
joinTo: "css/app.css"
},
templates: {
joinTo: "js/app.js"
}
},
conventions: {
// This option sets where we should place non-css and non-js assets in.
// By default, we set this to "/assets/static". Files in this directory
// will be copied to `paths.public`, which is "priv/static" by default.
assets: /^(static)/
},
// Phoenix paths configuration
paths: {
// Dependencies and current project directories to watch
watched: ["static", "css", "js", "vendor"],
// Where to compile files to
public: "../priv/static"
},
// Configure your plugins
plugins: {
babel: {
// Do not use ES6 compiler in vendor code
ignore: [/vendor/]
}
},
modules: {
autoRequire: {
"js/app.js": ["js/app"]
}
},
npm: {
enabled: true,
globals: {
$: 'jquery',
jQuery: 'jquery',
}
}
};