Importing and Exporting ES6 modules for sage roots.

es6importexport.js

PAGE NAME : group-slider.js at "script/components/group-slider.js"
//////////////////////////////

import Swiper, {Navigation, Pagination} from 'swiper';

Swiper.use([Navigation, Pagination]);

const groupSlider = new Swiper('#group-cards', {
  spaceBetween: 5,
  speed: 300,
  loop: true,
  centeredSlides: true,
  slidesPerView: 'auto',
  mousewheelControl: true,
  keyboardControl: true,
  observer: true,
  observeParents: true,

  breakpoints: {
    728: {
      grabCursor: true,
      observer: true,
      observeParents: true,
      slidesPerView: 3,
      spaceBetween: 25,
      mousewheelControl: true,
      keyboardControl: true,
      centeredSlides: false,
    },
  },

  pagination: {
    el: '.swiper-pagination',
    clickable: true,
  },

  navigation: {
    nextEl: '.group-swiper-button-next-outside',
    prevEl: '.group-swiper-button-prev-outside',
  },
})

export default groupSlider;

////////////////////////////


I have to now use this at my home.js router file then
///////////////////////////

import groupSlider from '../components/group-slider';

export default {
  init() {
    groupSlider.init();
  }
}