icehaunter/vue3-datepicker

Vue3.1.0 : Module parse failed: Unexpected token (500:60)

Opened this issue · 1 comments

Describe the bug

I encountered Module parse failed when using Vue 3.1

To Reproduce
Steps to reproduce the behavior:

  1. Use Vue 3.1.0 & @vue/compat 3.10
    "@vue/compat": "^3.1.0",
    "@vue/compiler-sfc": "^3.1.0",
    "vue": "^3.1.0",
    "vue-loader": "^16.0.0",
    "vue-style-loader": "^4.1.3",
    "vue3-datepicker": "^0.4.0",
  1. Attempt to use
<template>
  <div>
    <Datepicker v-model="picked" />
  </div>
</template>

<script setup>
  import Datepicker from 'vue3-datepicker'
  import { ref } from 'vue';
  const picked = ref(new Date())
</script>
  1. error
ERROR in ./node_modules/vue3-datepicker/dist/vue3-datepicker.mjs 500:60
Module parse failed: Unexpected token (500:60)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|   },
|   setup(e, { emit: t }) {
>     const r = $(null), l = $(null), o = u(() => e.pageDate ?? e.selected), p = $(o.value.getHours()), n = $(o.value.getMinutes());
|     ne(
|       () => e.selected,
 @ ./src/components/inputs/DateSelectInput.vue?vue&type=script&setup=true&lang=js (./node_modules/babel-loader/lib??ref--2-0!./node_modules/vue-loader/dist??ref--13-0!./src/components/inputs/DateSelectInput.vue?vue&type=script&setup=true&lang=js) 1:0-41 114:15-25
 @ ./src/components/inputs/DateSelectInput.vue?vue&type=script&setup=true&lang=js
 @ ./src/components/inputs/DateSelectInput.vue
 @ ./node_modules/babel-loader/lib??ref--2-0!./node_modules/vue-loader/dist??ref--13-0!./src/pages/informations/InformationsEducations.vue?vue&type=script&lang=js
 @ ./src/pages/informations/InformationsEducations.vue?vue&type=script&lang=js
 @ ./src/pages/informations/InformationsEducations.vue
 @ ./node_modules/babel-loader/lib??ref--2-0!./node_modules/vue-loader/dist??ref--13-0!./src/pages/informations/Informations.vue?vue&type=script&lang=js
 @ ./src/pages/informations/Informations.vue?vue&type=script&lang=js
 @ ./src/pages/informations/Informations.vue
 @ ./src/router/index.js
 @ ./src/index.js

Screenshots
Error screenshot:

CleanShot 2024-09-15 at 08 56 05@2x

=========================

Does it support Vue 3.1(Migration build) but use Vue 2 syntax? (I can't directly upgrade to the latest version of Vue because I need to use Vue 3.1 first to ensure compatibility between Vue 2 and Vue 3 syntax.)

I am using Vue 3.0.0 and am getting the same error