vue引入 "swiper": "^5.3.8",打包時(shí)報(bào)錯(cuò)Unexpected token: name ?Dom7?

引入swiper

import Swiper from 'swiper';
import 'swiper/css/swiper.css';

初始化圖片輪播

    initImage() {
      const vm = this;
      const mySwiper = new Swiper('.swiper-container', {
        spaceBetween: 16,
        slidesPerView: 3,
        observer: true, // 修改swiper自己或子元素時(shí),自動(dòng)初始化swiper
        observeParents: true, // 修改swiper的父元素時(shí),自動(dòng)初始化swiper
        preventClicksPropagation: true,
        autoplay: {
          delay: 1500,
          disableOnInteraction: true,
        }, // 可選選項(xiàng),自動(dòng)滑動(dòng)
        // 如果需要分頁器
        pagination: {
          el: '.swiper-pagination',
          clickable: true,
        },
        // 如果需要前進(jìn)后退按鈕
        navigation: {
          nextEl: '.swiper-button-next',
          prevEl: '.swiper-button-prev',
        },
        // 滑到最后一個(gè)隱藏前進(jìn)按鈕
        on: {
          slideChangeTransitionEnd() {
            if (this.isEnd) {
                  this.navigation.$nextEl.addClass('hide');
            } else {
              this.navigation.$nextEl.removeClass('hide');
            }
          },
        },
      });
        // 鼠標(biāo)覆蓋停止自動(dòng)切換
      mySwiper.el.onmouseover = function () {
        mySwiper.autoplay.stop();
        mySwiper.navigation.$nextEl.removeClass('hide');
        mySwiper.navigation.$prevEl.removeClass('hide');
      };
      // 鼠標(biāo)離開開始自動(dòng)切換
      mySwiper.el.onmouseout = function () {
        mySwiper.autoplay.start();
        mySwiper.navigation.$nextEl.addClass('hide');
        mySwiper.navigation.$prevEl.addClass('hide');
      };
    },

打包時(shí)報(bào)錯(cuò)

js/chunk-2e9a501f.85da2169.js from UglifyJs
Unexpected token: name ?Dom7?, expected: punc ?;? [js/chunk-2e9a501f.85da2169.js:133,6]

我也會(huì)一臉懵逼,為什么終于要發(fā)版啦,打包出錯(cuò),哭死,弱小無助,唯有度娘營救我,

UglifyJs 僅支持JavaScript(ECMAScript 5)。

怎么解決呢

   transpileDependencies: [
        "swiper",
        "dom7",
        "ssr-window"
    ],

transpileDependencies
Type: Array<string | RegExp>
Default: []
默認(rèn)情況下 babel-loader 會(huì)忽略所有 node_modules 中的文件。如果你想要通過 Babel 顯式轉(zhuǎn)譯一個(gè)依賴,可以在這個(gè)選項(xiàng)中列出來。
用來處理ES6語法,將其編譯為瀏覽器可以執(zhí)行的js語法。

結(jié)果

打包順利,求大佬告知swiper內(nèi)部封裝了什么導(dǎo)致這個(gè)問題

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容