Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
nissenyeh opened this issue Sep 15, 2024 · 1 comment
Open

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

nissenyeh opened this issue Sep 15, 2024 · 1 comment

Comments

@nissenyeh
Copy link

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.)

@nermin99
Copy link

I am using Vue 3.0.0 and am getting the same error

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants