Unable to import vue-pdf-embed in Nuxt3 project.

[marcusaram]

Hi, I'm trying to add vue-pdf-embed in my Nuxt3 project (yes, I know it is still beta). But reaching (hopefully) to the first release candidates. Using v1.1.0

Why trying to use VuePdfEmbed component (locally or globally) it fails on the import. Try to look in the source but couldn't find anything weird. Maybe this is a kind of compiler optimalization.

ReferenceError: self is not defined
    at Object.<anonymous> (/home/marcus/git/happy/frontend/node_modules/vue-pdf-embed/dist/vue3-pdf-embed.js:1:252)
    at Module._compile (node:internal/modules/cjs/loader:1097:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1151:10)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:168:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:197:25)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:341:24)
    at async __instantiateModule__ (file:///home/marcus/git/happy/frontend/.nuxt/dist/server/server.mjs:5272:3)
[vite dev] Error loading external "/home/marcus/git/happy/frontend/node_modules/vue-pdf-embed/dist/vue3-pdf-embed.js".

For what's worth, this is the part from the dist vue3-pdf-embed.js.

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("vue")):"function"==typeof define&&define.amd?define(["vue"],t):"object"==typeof exports?exports["vue-pdf-embed"]=t(require("vue")):e["vue-pdf-embed"]=t(e.vue)}(self,function(__WEBPACK_EXTERNAL_MODULE__103__){return(()=>{var __webpack_modules__={194:(e,t,r)=>{"use strict";r.r(t),r.d(t,{default:()=>n});t=r(645),t=r.n(t)()(function(e){return e[1]});t.push([e.id,".textLayer{position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden;opacity:.2;line-height:1}.textLayer span,.textLayer br{color:transparent;position:absolute;white-space:pre;cursor:text;transform-origin:0%

[marcusaram]

Sorry, I had to make sure that this is a client library/plugin. It is fixed by creating a plugin with the .client.js suffix.

[ChristopherJohnson25]

Sorry, I had to make sure that this is a client library/plugin. It is fixed by creating a plugin with the .client.js suffix.

@marcusaram - do you have a snippet of how you got this to work?

[getshaun24]

Any update on this?!

[hrynko]

Any update on this?!

Please check #114, there is no solution yet, but links to some other resolved issues