vue-slickがIE11で動かないときの対処法

jQueryで便利なカルーセルスライダープラグイン「Slick」というものをご存知でしょうか。
このプラグインをVueで簡単に利用できるようにVueコンポーネント化されたプラグインが「vue-slick」です。
このプラグインは大変便利なものですが、IE11では動作しないという致命的な問題を持っており、その対処方法をご紹介します。

対処方法

私がこのバグを確認したvue-slickのバージョンはv1.1.15で、これがIssuesに上がったのは2018年11月頃のようです。
問題はvue-slickでES6のPromiseが使われているため発生しているようです。
このIssuesをそのまま見て頂ければ対処方法はおわかりかと思いますが、vue-slickの記述があるjs(bundle.jsなど)の前に、下記のスクリプトを読み込ませることで解決できます。
<script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.5/bluebird.min.js"></script>

最後に

Vueのプラグインは便利なものも多いですが、色々なバグを抱えているものもそこそこあるようです。
ほとんどのプラグインはGithubに上がっていることが多いので、プラグインを利用する前やトラブルが起きた時はGithubの当該ページにあるIssuesを確認するとヒントを得られるかもしれません。

SNSでシェアする:

大場 正樹 / Cleysense株式会社 代表

Web制作会社に約3年勤務した後にフリーランスとしてWeb制作やWebマーケティングなどの事業で約6年活動し、事業拡大に伴い2019年7月にクライアントのWebマーケティング活動もサポートするWeb制作会社としてCleysense株式会社を設立。