Angular 2 と Webpack の開発者の皆さん、こんにちは。私はかなり長い間 angular 2 と systemjs を使用してきましたが、webpack は初めてでした (少し苦労して使い始めました)。
次のようなhtmlを持つコンポーネントがあります。
<div id="partners-slider" class="partners">
<div class="partners__slider js-slick-slider">
<a class="partners__item"><img src="assets/logo-company-1.png" alt="">Elite Construction Group, LLC</a>
<a class="partners__item"><img src="assets/logo-company-2.png" alt="">Pro Era Limited</a>
</div></div>
基本的にスライダーです。私は、アニメーションやその他のもののために、多くのプロジェクトで使用するライブラリを持っています。
スライダーを開始する次のような関数があります。
function initPartnersSlider(container) {
var $partnersSlider = $(container) ;
if (!$partnersSlider.length) return;
$partnersSlider
.find('.js-slick-slider')
.slick({
dots: false,
infinite: true,
speed: 300,
slidesToShow: 5,
autoplay: true,
accessibility: false,
prevArrow: $partnersSlider.find('.js-partners-prev'),
nextArrow: $partnersSlider.find('.js-partners-next'),
responsive: [
{
breakpoint: 1100,
settings: {
slidesToShow: 4
}
},
{
breakpoint: 1000,
settings: {
slidesToShow: 3
}
},
{
breakpoint: 768,
settings: {
slidesToShow: 1
}
}
]
});}
関数呼び出し:
initPartnersSlider('#partners-slider');
ここでの問題 $partnersSlider.length
は常に 0 です。
私の理解によると、html要素はwebpack(prod)によって縮小されたファイル内に配置されます
main.bundle.js
index.html 内の外部 JavaScript ファイルをスクリプト タグとして参照しています。id="properties-slider"
要素がmain.bundle.js?内にあるため、dom要素を認識していないようです。ライブラリコードでデバッグして見ることができます。
誰もそれをやったことがありますか?助けてくれてありがとう!