Здравствуйте! Не могу понять, почему слетает ширина любого (независимо от контента) слайдера на slick, при использовании через webpack. Поясню. Раньше я использовал slick напрямую, без webpack, es6 и es6 модулей. Сейчас у меня сделано так:
const $ = require('jquery');
require('slick-carousel');
module.exports = function(){
$('#works-slider-info').slick({
slidesToShow: 1,
slidesToScroll: 1,
fade: true,
});
...
И где то там заюзано в js страницы.
В вебпак конфиге тоже ничего особенного, jquery подключен:
const webpack = require('webpack');
const babel = require('babel-loader');
const presets = require('babel-preset-es2015');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const path = require('path');
const PATHS = {
source: path.join(__dirname, 'app'),
build: path.join(__dirname, 'dist'),
};
const config = {
entry: {
'index': PATHS.source + '/js/index.js',
'about': PATHS.source + '/js/about.js',
'works': PATHS.source + '/js/works.js',
'blog': PATHS.source + '/js/blog.js',
},
output: {
path: PATHS.build,
filename: './[name].js',
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: 'common',
}),
new UglifyJSPlugin({
sourceMap: true,
}),
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
'window.jQuery': 'jquery',
}),
],
module: {
loaders: [
{
test: /\.js$/,
loader: 'babel-loader?presets[]=es2015',
},
],
},
//'devtool':'source-map',
};
module.exports = config;
Я пробовал банально сделать простейший слайдер из 4 небольших img, вообще без стилей:
div(id='test')
each slide in imageSources
div
img(src=slide, alt="").img-responsive
И slick рассчитывал ширину стремящуюся в бесконечность. Т.е причина явно не в кривых стилях, что то в самом скрипте. Но что?