Search code examples
vue.jsnuxt.jssyncfusionej2-syncfusion

Using Syncfusion FileManager with NuxtJS

I'm trying to use Syncfusion Vue FileManager with NuxtJS.

<template>
  <div>
    <h1>Test Page</h1>
    <ejs-filemanager></ejs-filemanager>
  </div>
</template>

<script>
import Vue from 'vue';
import { FileManagerPlugin } from '@syncfusion/ej2-vue-filemanager';

Vue.use(FileManagerPlugin);
export default {
  auth: false,
};
</script>

<style scoped>
@import '../node_modules/@syncfusion/ej2-base/styles/material.css';
@import '../node_modules/@syncfusion/ej2-icons/styles/material.css';
@import '../node_modules/@syncfusion/ej2-inputs/styles/material.css';
@import '../node_modules/@syncfusion/ej2-popups/styles/material.css';
@import '../node_modules/@syncfusion/ej2-buttons/styles/material.css';
@import '../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css';
@import '../node_modules/@syncfusion/ej2-navigations/styles/material.css';
@import '../node_modules/@syncfusion/ej2-layouts/styles/material.css';
@import '../node_modules/@syncfusion/ej2-grids/styles/material.css';
@import '../node_modules/@syncfusion/ej2-vue-filemanager/styles/material.css';
</style>

This is my Sample-Page where I want to mess around with the FileManager. Unfortunately importing the FileManagerPlugin leads to the error in the Picture, when starting the server.

Syncfusion Error

I have added the following dependencies to my package.json:

"@syncfusion/ej2-vue-filemanager": "^19.2.48",
"vue-class-component": "^7.2.6",

I'm also receiving the error:

in ./node_modules/@syncfusion/ej2-vue-filemanager/src/file-manager/filemanager.component.js                                           friendly-errors 11:49:40  

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

But without installing vue-class-component it doesn't start at all.

Solution

  • Looking at this Github issue, it looks like you need to install (at least)
    vue-class-component : 8.0.0-rc.1