Javascript 放大弹出窗口不适用于网页包
在将其导入app.js文件后,我通过“npm I magnific popup”命令安装了magnific popup。但在浏览器控制台中显示(放大弹出窗口不是功能) app.jsJavascript 放大弹出窗口不适用于网页包,javascript,jquery,webpack,magnific-popup,Javascript,Jquery,Webpack,Magnific Popup,在将其导入app.js文件后,我通过“npm I magnific popup”命令安装了magnific popup。但在浏览器控制台中显示(放大弹出窗口不是功能) app.js import $ from "jQuery"; window.$ = window.jQuery = $; import "magnific-popup"; $(document).ready(function() { $('.play-btn').magnificPopup({ type: 'video'
import $ from "jQuery";
window.$ = window.jQuery = $;
import "magnific-popup";
$(document).ready(function() {
$('.play-btn').magnificPopup({ type: 'video' });
});
webpack.config.js
var path = require("path");
var webpack = require('webpack');
module.exports = {
entry: {
app: "./app/assets/scripts/app.js",
vendor: "./app/assets/scripts/vendor.js"
},
output: {
path: path.resolve(__dirname, "./app/temp/scripts"),
filename: "[name].js"
},
module: {
rules: [{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ["es2015"]
}
}
}
]
},
plugins: [
new webpack.ProvidePlugin({
'$': 'jquery',
'jQuery': 'jquery',
'window.jQuery': 'jquery'
}),
]
}
很简单,您的文件不在导入位置。请检查您的路径或文件位置/位置一次。此外,请检查您的JQuery库(如果包含),然后它应该位于此库文件/代码上方。我已解决了此问题 jQuery不需要在app.js中导入 修复app.js后,文件如下所示
import "magnific-popup";
$(document).ready(function() {
$('.play-btn').magnificPopup({ type: 'video' });
});
Jquey和放大弹出文件位于导入位置(节点\模块)。JQuery库也包含在放大弹出插件的上方