如何在Next.js客户端使用heic2any？

vd2z7a6w 于 2023-04-11 发布在其他

关注(0)|答案(1)|浏览(189)

代码如下：

import convert from 'heic2any'

try {
    convertedImage = await convert({ blob: propsAndFile?.file })
} catch (error) {
    console.error(error)
}

但是得到了这个错误，尽管他们承诺它将在客户端运行：https://www.npmjs.com/package/heic2any

info  - Collecting page data ..node:internal/process/promises:289
            triggerUncaughtException(err, true /* fromPromise */);
            ^

ReferenceError: window is not defined
    at /Users/janoskukoda/Workspace/tikex/portal/team/node_modules/heic2any/dist/heic2any.js:23:1
    at /Users/janoskukoda/Workspace/tikex/portal/team/node_modules/heic2any/dist/heic2any.js:11:26
    at Object.<anonymous> (/Users/janoskukoda/Workspace/tikex/portal/team/node_modules/heic2any/dist/heic2any.js:20:2)
    at Module._compile (node:internal/modules/cjs/loader:1205:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1259:10)
    at Module.load (node:internal/modules/cjs/loader:1068:32)
    at Module._load (node:internal/modules/cjs/loader:909:12)
    at Module.require (node:internal/modules/cjs/loader:1092:19)
    at require (node:internal/modules/cjs/helpers:103:18)
    at 2233 (/Users/janoskukoda/Workspace/tikex/portal/team/.next/server/pages/_app.js:176:18) {
  type: 'ReferenceError'
}

Node.js v19.1.0

next.js

来源：https://stackoverflow.com/questions/74842883/how-to-use-heic2any-in-next-js-client-side

1条答案

按热度按时间

x6492ojm1#

首先，我在调用之前检查了typeof window！== 'undefined'，然后在函数中使用require，而不是在顶层导入。

if (typeof window !== 'undefined') {
      const heic2any = require('heic2any');
      await heic2any({
        blob: image,
        toType: 'image/jpeg',
        quality: 0.8 // Set the desired JPEG quality (0 to 1)
      }) // error check after//
}

赞(0）回复(0）举报 2023-04-11

我来回答

如何在Next.js客户端使用heic2any？

1条答案

相关问题

热门标签

最新问答