Jenesius / vue-modal

๐Ÿ––The progressive and simple modal system for Vue.js v3
https://modal.jenesius.com
MIT License
145 stars 14 forks source link

Build error with latest version #17

Closed ina6ra closed 3 years ago

ina6ra commented 3 years ago

It seems that an error occurs in 1.1.0 and later versions.

ERROR  Failed to compile with 1 error                                                                                                                     18:37:10
error  in ./node_modules/jenesius-vue-modal/plugin/index.js

Module parse failed: Unexpected token (44:6)
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
| class ModalObject{
|
>     id;
|     component;
|     params;

 @ ./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/App.vue?vue&type=script&lang=js 4:0-45 10:26-35
 @ ./src/App.vue?vue&type=script&lang=js
 @ ./src/App.vue
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://192.168.0.101:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
Jenesius commented 3 years ago

Hmm

Jenesius commented 3 years ago

@ina6ra Do you have this project on github? I want to test it

Jenesius commented 3 years ago

I think that loader not understand var of class... maybe need to add babel to package.json I will test it now

Jenesius commented 3 years ago

https://github.com/webpack/webpack/issues/10216

ina6ra commented 3 years ago

@ina6ra Do you have this project on github? I want to test it

Yes, but private ๐Ÿ”’

No problem for new projects.

$ vue --verion
@vue/cli 4.5.13
$ vue create my-project
> Default (Vue 3) ([Vue 3] babel, eslint)
$ cd my-project
$ yarn add jenesius-vue-modal
$ yarn build
Done in 25.78s.

Here is a part of package.json that I use.

{
  "name": "my-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "test:unit": "vue-cli-service test:unit"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.35",
    "@fortawesome/free-brands-svg-icons": "^5.15.3",
    "@fortawesome/free-solid-svg-icons": "^5.15.3",
    "@fortawesome/vue-fontawesome": "^3.0.0-4",
    "@tailwindcss/postcss7-compat": "^2.0.2",
    "airtable-plus": "^1.0.4",
    "autoprefixer": "^9",
    "daisyui": "^1.3.4",
    "dayjs": "^1.10.5",
    "japanese-string-utils": "^0.2.4",
    "jenesius-vue-modal": "1.0.14",
    "lodash": "^4.17.21",
    "nholiday-jp": "^1.0.8",
    "postcss": "^7",
    "simple-get-promise": "^3.0.0",
    "string-strip-html": "^8.3.0",
    "tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.0.2",
    "ua-parser-js": "^0.7.28",
    "urijs": "^1.19.6",
    "vue": "^3.0.0",
    "vue-router": "^4.0.0-0",
    "vue3-datepicker": "^0.2.4",
    "vuex": "^4.0.0-0"
  },
  "devDependencies": {
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-unit-mocha": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0",
    "@vue/test-utils": "^2.0.0-0",
    "chai": "^4.1.2",
    "gulp-shell": "^0.8.0",
    "vue-cli-plugin-tailwind": "~2.0.6"
  }
}
Jenesius commented 3 years ago

yes, there is a problem I will use rollup to fix,but i have a problem

Jenesius commented 3 years ago

Okay, rollup files ready, Now I will test them and tell a result image

Jenesius commented 3 years ago

hmm... my bubel config not don't fix this error, will simple hide the public fields of class

Jenesius commented 3 years ago

@ina6ra, ready: 1.1.7 I'm update version of vue cli and then i start getting errors with new feathers of JS(babel for help..) Thnx for opening the Issue!

ina6ra commented 3 years ago

Thank you for your support. There are no build errors but another error has occurred.

Error: "Modal Container not found. Put container from jenesius-vue-modal in App's template. Check documentation for more information https://www.npmjs.com/package/jenesius-vue-modal."
ina6ra commented 3 years ago

Sorry. Maybe my code is just wrong where it has nothing to do with the library.

Jenesius commented 3 years ago

This warning is showed when you try openModal or pushModal without ModalContaoner Before opening the modal's window, u need to insert ModalContainer(where modal will rendered)

//Your App.vue for example
<template>
  <modal-container/>
   .
   .
   .
</template>
<script>
    import {container} from "jenesius-vue-modal";
    export default {
        components: {ModalContainer: container}
    }
</script>
Jenesius commented 3 years ago

Hmm, also need do warnings from library more better, with link to documentation.

ina6ra commented 3 years ago

This Isn't a good way, but it's solved.

$ del *.lock
$ rd /s /q node_modules
$ yarn install
$ yarn build
Done in 47.34s.
$ npm ls jenesius-vue-modal
`-- UNMET DEPENDENCY jenesius-vue-modal@1.1.7 
npm ERR! missing: jenesius-vue-modal@1.1.7, required by my-project@0.1.0

After all it was unknown what was the cause.