search

hrynko / vue-pdf-embed

PDF embed component for Vue 2 and Vue 3
https://npmjs.com/package/vue-pdf-embed
MIT License
740 stars 111 forks source link

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

Closed marcusaram closed 2 years ago

marcusaram commented 2 years ago

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 commented 2 years ago

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 commented 2 years ago

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 commented 1 year ago

Any update on this?!

hrynko commented 1 year ago

Any update on this?!

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