Пытаюсь настроить окружение для работы с webpack. Модули npm загружены, там есть jquery и первый плагин - YTPlayer. В точку сборки подключил jquery, в коде он доступен, работает. Когда подключаю туда плагин - пишет ...YTPlayer is not a function... в скомпиленом файле он есть! Но почему-то недоступен... Перерыл уже все мануалы, перепробовал все варианты, ничего не пойму. Вот конфиг webpack.config.js:
const path = require('path');
// webpack.config.js
const webpack = require('webpack')
module.exports = {
plugins: [
new webpack.ProvidePlugin({
$: 'jquery',
'$': 'jquery',
jquery: 'jquery',
jQuery: 'jquery',
'window.jquery': 'jquery',
'window.jQuery': 'jquery',
'window.$': 'jquery'
})
],
entry: ['./code/template.js', './scss/template.scss'],
output: {
path: path.resolve(__dirname, 'assets'),
filename: 'template.js'
},
resolve: {
root: ['./node_modules']
},
module: {
rules: [
{
test: /\.(scss)$/,
use: [
{
loader: 'file-loader',
options: {
name: '[name].css',
outputPath: ''
}
},
//{
// Adds CSS to the DOM by injecting a `<style>` tag
// This loader using when disable file-loader, to include css into bundle.js
//loader: 'style-loader'
//},
//{
// Interprets `@import` and `url()` like `import/require()` and will resolve them
// This loader using when disable file-loader, to include css into bundle.js
//loader: 'css-loader'
//},
{
// Loader for webpack to process CSS with PostCSS
loader: 'postcss-loader',
options: {
plugins: function () {
return [
require('autoprefixer')
];
}
}
},
{
// Loads a SASS/SCSS file and compiles it to CSS
loader: 'sass-loader'
}
]
}
]
},
watch: true,
devtool: "source-map",
// This remove jquery code from bundle to use external CDN
externals: {
//jquery: 'jQuery'
}
};
Вот код точки сборки template.js:
import 'bootstrap';
import $ from 'jquery';
import 'jquery.mb.ytplayer';
import './web'
он подключает файл web.js, в котором я вызываю плагин, и он нифига не работает!!!
import $ from "jquery";
import 'jquery.mb.ytplayer';
$(document).ready(function () {
$("button.offcanvas").click(function (e) {
$("body").toggleClass("hide");
e.preventDefault();
return false;
});
$(".offside").click(function (e) {
$("body").toggleClass("hide");
//e.preventDefault();
//return false;
});
$("#bgndVideo").YTPlayer();
});
Хотя компилируется, и код там присутствует. Собирает jquery, YTPlayer и web.js
В template.js:
let $ = require('jquery');
window.$ = window.jQuery = $;
import 'bootstrap';
import 'jquery.mb.ytplayer';
import './web'
в скриптах уже импортировать $ не надо, поскольку jQuery использует глобальную переменную
Оборудование для ресторана: новинки профессиональной кухонной техники
Частный дом престарелых в Киеве: комфорт, забота и профессиональный уход
Хочу вывести на страницы данный в таком формате: [{'group_name': <>, 'date': [<>,<>,
Есть статичная круговая диаграмма