Can't resolve "vue-class-component"

[Mateusz]

Hello,

I'm using vue2 and I updated syncfusion to version 19.2.47 after that I cannot build my solution because I get a error: "Can't resolve 'vue-class-component'". This erro

Best regards,
Mateusz

[Deepak Ramakrishnan]

Hi Mateusz,  

 

Greetings from Syncfusion support.  

 

We will check and update the details in two business days (20^th July 2021). We appreciate your patience until then.  

 

Regards,  

Deepak R. 

[Berly Christopher]

Hi Mateusz, 

  

Thanks for the patience. 

  

We have validated the reported issue. We need to install the “vue-class-component” separately in the Vue 2 application with help of the “npm install --save vue vue-class-component” command. For your convenience, we have prepared the sample and attached it below. 

  

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/quickstart1498658104  

  

Regards, 

Berly B.C 

[Alberto Monteverdi]

Hi,

I installed as suggested vue-class-component and in my Vue 2 project I have ejs-schedule component ver. 19.2.47.

When I compile the project I get the following errors:

 WARNING Compiled with 2 warnings 6:36:20 PM

 warning in ./node_modules/@syncfusion/ej2-vue-schedule/src/recurrence-editor/recurrenceeditor.component.js

"export 'Options' was not found in 'vue-class-component'

 warning in ./node_modules/@syncfusion/ej2-vue-schedule/src/schedule/resources.directive.js

"export 'Vue' (imported as 'Vue3') was not found in 'vue-class-component'

Can You give me any help ?

Alberto.

[Berly Christopher]

Hi Alberto, 

  

We will validate and update the further details in two business days (27^th July 2021). We appreciate your patience until then. 

  

Regards, 

Berly B.C 

[Mateusz]

Hi,

When I added "@syncfusion/ej2-vue-grids" to code sample from Berly Christopher I had many warning like this:

and grid didn't show up.

Attachment: quickstart1498658104_8b9ce25b.zip

[Berly Christopher]

Hi Mateusz, 

 

We have validated your reported query "Not able to load syncfusion Schedule and Grid component" and confirmed this as defect at our end. So, we have logged the bug reported "Syncfusion Vue Components are not working in Vue 2" which can be tracked from the following link.  

  

https://www.syncfusion.com/feedback/27318/syncfusion-vue-components-are-not-working-in-vue-2  

   

The issue fix for this defect will be included in our upcoming weekly patch release which is expected to be rolled out by July 27, 2021. We would appreciate your valuable patience until then.   

 

Regards, 

Berly B.C 

[Berly Christopher]

Hi Mateusz,  

Thanks for being patience.  

The reported issue with rendering Schedule and Grid component in Vue2 has been resolved in latest weekly patch release v19.2.49, so please upgrade your version to overcome the problem.  

https://www.syncfusion.com/feedback/27318/syncfusion-vue-components-are-not-working-in-vue-2  

Please let us know if you need any further assistance.  

Regards,  

Berly B.C 

[Michael]

Hello, I am running into this same issue with syncfusion/ej2-vue-calendars 19.2.47. I ran the npm install this morning so it seems it wasn't fixed for this one yet.

[Berly Christopher]

Hi Michael, 

  

We have resolved the issues in the latest version 19.2.0.49. Can you please ensure that the packages are installed correctly with latest version? Still issue persist in the latest version, share the faced issue call stack or simple issue reproducing sample that will help us to check and proceed further from our end. 

  

Regards, 

Berly B.C 

[William Morgenweck]

After doing “npm install --save vue vue-class-component” is seems that other non Syncfusion components broke and now my application is dead in the water and will have to be rebuilt from the beginning. Is there a way that I can use Charts in a Vue 2.6.4 without using this vue-class-component?

Update: Here was my fix

Since this was an existing project I updated all Syncfusion installed components to the highest 18 versions. That meant downgrading the new Chart installs that were 19.

so I had to do -- yarn add @syncfusion/ej2-vue-charts@18.4.46 - no 19 versions of any component

I uninstalled the vue-class-component and last I had to change the vue template compiler to: "vue-template-compiler": "2.6.12" and the I also had to change the vue version to "vue": "2.6.12" so that the 2 matched. I recompiled the the app and it seems to be running fine.

error code below.

Module build failed (from ./node_modules/vue-loader/lib/index.js):

TypeError: Cannot read property 'parseComponent' of undefined

- parse.js:15 parse

[Workspace_Excel]/[@vue]/component-compiler-utils/dist/parse.js:15:23

- index.js:67 Object.module.exports

[Workspace_Excel]/[vue-loader]/lib/index.js:67:22

Module build failed (from ./node_modules/vue-loader/lib/index.js):

TypeError: Cannot read property 'parseComponent' of undefined

- parse.js:15 parse

[Workspace_Excel]/[@vue]/component-compiler-utils/dist/parse.js:15:23

- index.js:67 Object.module.exports

[Workspace_Excel]/[vue-loader]/lib/index.js:67:22

Module build failed (from ./node_modules/vue-loader/lib/index.js):

TypeError: Cannot read property 'parseComponent' of undefined

- parse.js:15 parse

[Workspace_Excel]/[@vue]/component-compiler-utils/dist/parse.js:15:23

- index.js:67 Object.module.exports

[Workspace_Excel]/[vue-loader]/lib/index.js:67:22

Module build failed (from ./node_modules/vue-loader/lib/index.js):

TypeError: Cannot read property 'parseComponent' of undefined

- parse.js:15 parse

[Workspace_Excel]/[@vue]/component-compiler-utils/dist/parse.js:15:23

- index.js:67 Object.module.exports

[Workspace_Excel]/[vue-loader]/lib/index.js:67:22

Module build failed (from ./node_modules/vue-loader/lib/index.js):

TypeError: Cannot read property 'parseComponent' of undefined

- parse.js:15 parse

[Workspace_Excel]/[@vue]/component-compiler-utils/dist/parse.js:15:23

- index.js:67 Object.module.exports

[Workspace_Excel]/[vue-loader]/lib/index.js:67:22

[Ponmani Murugaiyan]

Hi William,  

Thanks for the update. 

We have rendered chart without vue-class-component. Please find the sample and steps to run the sample below for reference.  

Steps to run  

 

1. npm install
2. npm run dev

Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/ChartVue2-1044915810.zip   

Kindly check with the above sample and get back us if you need further assistance.  

Regards,  

Ponmani M 

[Gal Bracha]

I'm having the same issues with:

"@syncfusion/ej2-vue-dropdowns": "^20.1.58",
"@syncfusion/ej2-vue-querybuilder": "^20.1.55",

"vue-class-component": "^7.0.2",

 WARNING Compiled with 6 warnings 3:47:54 PM

 warning in ./node_modules/@syncfusion/ej2-vue-dropdowns/src/drop-down-tree/dropdowntree.component.js

"export 'Options' was not found in 'vue-class-component'

 warning in ./node_modules/@syncfusion/ej2-vue-dropdowns/src/list-box/listbox.component.js

"export 'Options' was not found in 'vue-class-component'

 warning in ./node_modules/@syncfusion/ej2-vue-dropdowns/src/multi-select/multiselect.component.js

"export 'Options' was not found in 'vue-class-component'

 warning in ./node_modules/@syncfusion/ej2-vue-dropdowns/src/auto-complete/autocomplete.component.js

"export 'Options' was not found in 'vue-class-component'

 warning in ./node_modules/@syncfusion/ej2-vue-dropdowns/src/combo-box/combobox.component.js

"export 'Options' was not found in 'vue-class-component'

 warning in ./node_modules/@syncfusion/ej2-vue-dropdowns/src/drop-down-list/dropdownlist.component.js

"export 'Options' was not found in 'vue-class-component'

[Gal Bracha]

Upgraded to the latest and it still output those warnings

"vue-class-component": "^7.2.6",

[Gal Bracha]

This is what fixed it - downgrading to this version ->

"@syncfusion/ej2-vue-dropdowns": "^21.2.7",
"@syncfusion/ej2-vue-querybuilder": "^21.2.7",

[UdhayaKumar Duraisamy]

Hi Gal,

The current latest version for Syncfusion components is 20.1.58v. We don’t have version 21.1.27. You are using Caret (^) notation in the package version and the Caret(^) is used for automatically updating the minor updates along with patch updates. So, we suspect that it will install the 20.1.58 version. Also, we request you to provide additional details about the issue i.e., issue replication sample, etc... This will help us validate the issue further and provide you with a better solution.

Regards,

Udhaya Kumar D.

[Nurbek]

Hello,I am getting an error from all the components where vue-component is used.
``` 
warning in ./node_modules/@syncfusion/ej2-vue-splitbuttons/src/drop-down-button/items.directive.js

"export 'Options' was not found in 'vue-class-component'

```
Can you provide a relevant version of package and also command to install(downgrade it).Thanks

[YuvanShankar Arunagiri]

Hi Nurbek,

In our ej2-vue-base package, we keep a Post Install process for our vue components, this post install process will occur for the components while installing with the ej2-vue-base package. In your scenario, we believe you have installed the vue inputs component after installing the ej2-vue-base package. This problem will be resolved if you delete the node_modules and install the packages once again. Meanwhile we have considered this as a bug at our end and we have planned this fix for our upcoming weekly patch release which is scheduled on 5^th July 2022.

You can check the status of this fix from the below feedback link

https://www.syncfusion.com/feedback/35633/for-vue-2-vue-class-component-is-not-removed-in-the-component-repository

We appreciate your patience until then.

Regards,

YuvanShankar A

[YuvanShankar Arunagiri]

Hi Nurbek,

We regret for the inconvenience.

We have rolled out our 2022 volume 2 recently, and hence the scheduled weekly patch release has been called off for this week. We will include the fix in our next weekly patch release scheduled for July 12, 2022 and will let you know once it is released.

Regards,

YuvanShankar A

[YuvanShankar Arunagiri]

Hi Nurbek,

Sorry for the inconvenience.

We are still facing more difficulty on implementing this fix. So, we have planned to include this in our volume 2 SP release, which will be scheduled on first week of August month, 2022. We appreciate your patience until then. You can also track the status of this bug by using below feedback portal link

Feedback Link: https://www.syncfusion.com/feedback/35633/for-vue-2-vue-class-component-is-not-removed-in-the-component-repository

Regards,

YuvanShankar A

[Nurbek]

Thank you very much for your update,I am waiting your voule 2 SP release.

Best regards.

[YuvanShankar Arunagiri]

You are welcome, Nurbek. As promised, we will get back to you by mid of August.

[YuvanShankar Arunagiri]

Hi Nurbek,

Thanks for the patience.

We are glad to announce that our weekly patch release (20.2.45) is rolled out. We have included the fix for this issue in this release. So, we suggest you upgrade our Syncfusion packages to our latest version to resolve this issue in your end. (20.2.45).

Feedback link: https://www.syncfusion.com/feedback/35633/for-vue-2-vue-class-component-is-not-removed-in-the-component-repository

Release notes: https://ej2.syncfusion.com/vue/documentation/release-notes/20.2.45/?type=all#common

Regards,

YuvanShankar A

[Noureddine]

Hello,

I am facing the same problem with vue@"^3.2.45" from nuxt@3.0.0

I am getting this error : 

Could not resolve "vue-class-component"

    node_modules/@syncfusion/ej2-vue-buttons/src/chips/chips.directive.js:21:22:

      21 │ import * as Vue3 from 'vue-class-component';

this is my package.json:

{
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "nuxt": "^3.0.0"
  },
  "dependencies": {
    "@syncfusion/ej2-vue-base": "^20.4.42",
    "@syncfusion/ej2-vue-buttons": "^20.4.42"
  }
}

[YuvanShankar Arunagiri]

Hi Noureddine,

We have already considered this feature (Need to provide the support for Nuxt 3 to our vue3 components) at our end and it's available in our queue. Usually, Syncfusion will plan and implement the features based on feature rank, customer requested count and volume wish-list. We will implement and include this feature in any one of our upcoming releases.

Feedback link: https://www.syncfusion.com/feedback/37471/need-to-provide-the-support-for-nuxt-3-to-our-vue3-components

Regards,

YuvanShankar A

[Arwin]

Hi,

I'm getting the same error message building our application using Vue 3.2.45

'Could not resolve "vue-class-component"'

"import * as Vue3 from 'vue-class-component';"

My dependencies:

"dependencies": {
    "@syncfusion/ej2-vue-calendars": "20.4.44",
    "@syncfusion/ej2-vue-schedule": "20.4.44",
    "vue": "^3.2.0",

[YuvanShankar Arunagiri]

Hi Arwin,

Sorry for the delay. To resolve this issue, kindly install the “vue-class-component” packages.

"vue-class-component": "8.0.0-rc.1"

For more details, please refer the below UG link.

UG link: https://ej2.syncfusion.com/vue/documentation/system-requirements/

Get back to us if you need any further assistance on this. 

Regards,

YuvanShankar A