copy-image-clipboard icon indicating copy to clipboard operation
copy-image-clipboard copied to clipboard

Import error for SvelteKit

Open michelheusschen opened this issue 2 years ago • 5 comments

Describe the bug

Importing this package in SvelteKit leads to warnings in development and to errors in production builds related to ES modules.

I've set up a demo where I've made the following changes from a new SvelteKit project:

  1. npm install copy-image-clipboard
  2. In src/routes/+page.svelte I've added basic code to check for image copy support:
import { canCopyImagesToClipboard } from 'copy-image-clipboard';

onMount(() => {
	const canCopy = canCopyImagesToClipboard();

	console.log('Can Copy Images To Clipboard:', canCopy);
});

When running in development mode with vite dev I get the following warning: copy-image-clipboard doesn't appear to be written in CJS, but also doesn't appear to be a valid ES module (i.e. it doesn't have "type": "module" or an .mjs extension for the entry point). Please contact the package author to fix. Forced re-optimization of dependencies

When creating a production build with vite build I get the following error:

(node:13) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
/home/projects/sveltejs-kit-template-default-8qhsvf/node_modules/copy-image-clipboard/dist/index.js:175
export { canCopyImagesToClipboard, convertBlobToPng, copyBlobToClipboard, copyImageToClipboard, createImageElement, getBlobFromImageElement, getBlobFromImageSource, isJpegBlob, isPngBlob, requestClipboardWritePermission };
^^^^^^

SyntaxError: export declarations may only appear at top level of a module
    at compileFunction (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:6:341450)
    at wrapSafe (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:6:218347)
    at Module.prototype._compile (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:6:218723)
    at Module._extensions[".js"] (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:6:219743)
    at Module.prototype.load (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:6:217769)
    at Module._load (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:6:215340)
    at <anonymous> (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:6:983454)
    at _evaluate (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:15:300439)
    at _evaluate (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:15:300563)
    at <anonymous> (<anonymous>)
Error: 500 /
    at normalise_error_handler/<@file://file:///home/projects/sveltejs-kit-template-default-8qhsvf/node_modules/ (sveltejs/kit/src/core/postbuild/prerender.js:68:12)
    at save@file://file:///home/projects/sveltejs-kit-template-default-8qhsvf/node_modules/ (sveltejs/kit/src/core/postbuild/prerender.js:370:21)
    at visit@file://file:///home/projects/sveltejs-kit-template-default-8qhsvf/node_modules/ (sveltejs/kit/src/core/postbuild/prerender.js:219:7)
    at <anonymous> (<anonymous>)
[vite-plugin-sveltekit-compile] Failed with code 1
error during build:
Error: Failed with code 1
    at fn/</<@file://file:///home/projects/sveltejs-kit-template-default-8qhsvf/node_modules/ (sveltejs/kit/src/utils/fork.js:83:13)
    at EventEmitter.prototype.emit (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:6:155574)
    at ChildProcess/this._handle.onexit (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:6:956239)
    at _onChildExit/< (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:15:393246)
    at _0x5d97a4 (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:15:150541)
    at _0x2fb6cc/< (https://sveltejskittemplatedefault8qhs-lxfs.w-corp.staticblitz.com/blitz.927bd077ab89da68c6338c4363cc22e79cccb4ef.js:15:150281)
    at <anonymous> (<anonymous>)

michelheusschen avatar Feb 15 '23 14:02 michelheusschen

Screenshot 2023-03-21 at 09 36 55 i got same err

ducthinh56 avatar Mar 21 '23 02:03 ducthinh56

I also encountered this problem. I think you should add "type" : "module" in package.json

Mathieu-COSYNS avatar Dec 09 '23 16:12 Mathieu-COSYNS

publint is really helpful for catching errors like these: https://publint.dev/copy-image-clipboard

benmccann avatar Jun 14 '24 22:06 benmccann

This was fixed in https://github.com/LuanEdCosta/copy-image-clipboard/pull/45 by adding the missing "type": "module", but hasn't been released yet

@LuanEdCosta do you think we could get a new release?

benmccann avatar Jun 14 '24 22:06 benmccann

@LuanEdCosta it'd be super helpful to us if we could get a new release. Would you be able to help us out?

benmccann avatar Jun 28 '24 03:06 benmccann