Пробую подключить к проекту slick через webpack по примеру репозитария автора. В этом репозитории слайдер срабатывает.В моем проекте не заводиться, хотя вроде подключается почти так же (отличие - в проекте используется gulp, webpack подключается через него).
В чем может быть ошибка? Что стоит попробовать?
Репозиторий от автора слайдера с работающим примером
ссылка
Симптомы проблемы
jQuery скрипты без использования плагинов срабатывают корректно.
При подключении 'slick-carousel' выдает:
Uncaught TypeError: (0 , _jquery2.default)(...).slick is not a function
или (если подключить jquery в webpack глобально через ProvidePlugin)
$(...).slick is not a function.
Код app.js
import $ from 'jquery';
import 'slick-carousel';
$(".slider-wrapper").slick();
Версии установленных зависимостей
"devDependencies": {
"webpack": "3.4.1",
"webpack-stream": "^4.0.0",
},
"dependencies": {
"jquery": "1.11.1",
"slick-carousel": "1.6.0"
}
Конфиг webpack
const path = require('path'); //npm module for absolute path like path.resolve(__dirname, './build')
const config = require('./gulp/config.js');
var webpack = require('webpack');
module.exports = {
entry: './'+ config.src.jsEntryPoint,
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, './' + config.dest.js),
},
// watch: true, //live-reloading
devtool: 'source-map',
module: {
rules: [
{
test: /\.js?$/,
loader: "babel-loader"
},
{
test: require.resolve("jquery"),
use: [
{
loader: "expose-loader",
options: "jQuery"
},
{
loader: "expose-loader",
options: "$"
}
]
}
]
},
};
Конфиг подключения Webpack к Gulp
const gulp = require('gulp');
const webpackStream = require('webpack-stream');
const webpack = require('webpack');
const config = require('../config.js');
gulp.task('js-webpack', function() {
gulp.src(config.src.jsEntryPoint)
.pipe( webpackStream( require('../../webpack.config.js'), webpack ))
.pipe(gulp.dest(config.dest.js));
});
Ответ
Коллеги, проблема решена. Проблема была в конфликте зависимостей. Ее решило удаление lock-файла и установка node_modules заново.
Комментариев нет:
Отправить комментарий