Unexpected token <

[WangHansen]

When used with Nuxt.js, got 'Unexpected token <'

{ /Users/name/Projects/project/node_modules/vue-json-excel/JsonExcel.vue:1
(function (exports, require, module, __filename, __dirname) { <template>
                                                              ^

SyntaxError: Unexpected token <
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:616:28)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)

[jecovier]

Hello, I'm gonna check this out. Never use it inside nuxt I assume it needs a little change (?) thanks for the comment

[fjrial]

The same is happening to me when I use it under Electron/vue (https://github.com/SimulatedGREG/electron-vue

[jecovier]

@WangHansen I could load vue-json-excel into nuxt following the steps describe in this article: https://medium.com/@codebeast_/why-your-third-party-plugin-dont-work-in-nuxt-and-how-to-fix-it-d1a8caadf422
Look for the "Second Attempt: Vue Plugins" part.
But when I restart the npm run dev process it throw an "render function or template not defined in component" error. Maybe it's a problem from my installation, could you try this solution?

[jecovier]

@fjrial mmm, I think the problem is that nuxt and electron load the modules with require and this plugin use export... I try to rewrite the code to allow use require but I couldn't run the template

[WangHansen]

@jecovier Sorry about the late reply, was busy these days. It worked from the method in the link you provided, all it needed was ssr: false when use it like describe in here

[WangHansen]

The only problem right now is I get this warning:

[Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>. Bailing hydration and performing full client-side render.

[BartekMoment]

@WangHansen and if the same error occurs in Electron? Do you have any solution for this?

Edit:
I found a solution for myself 😉
All you need to do is add a white letter pack in the webpage configuration

In the file: webpack.renderer.config.js

let whiteListedModules = ['vue' , 'vue-json-excel']

And it works 👍

[aaaguirrep]

Hi

I have the same problem when i use the plugin in nuxt project, is there any solutions?

Thanks in advance.

[frostspb]

Me too. In dev and in prod

[aaaguirrep]

Any status about the issue?

[frostspb]

maybe problem with server side rendering in this code

base64ToBlob(data, mime) {
      let base64 = window.btoa(window.unescape(encodeURIComponent(data)));

[HiraveBapu]

i get this error when i run the Unit Test using Jest only. My application is not Nuxt app, its VueJS client side portal. Any suggestions ?

[guochangxindeGH]

@WangHansen，如果在Electron中发生相同的错误？您对此有什么解决方案吗？

编辑：
我为自己找到了解决方案😉
您需要做的就是在网页配置中添加一个白色字母包

在文件中：webpack.renderer.config.js

let whiteListedModules = ['vue' , 'vue-json-excel']

而且有效 👍