Build failed because of import package

[eramax]

Description

I am build a static website, I don't need ssr
Some packages I was not able to import
for example
jodit package which is an editor

The error message I get when I try to execute yarn build is

➜  myblog-svelte git:(master) ✗ yarn build
yarn run v1.22.10
warning package.json: No license field
$ svelte-kit build
vite v2.4.2 building for production...
transforming (25) src/Lib/github.js
warn - You have enabled the JIT engine which is currently in preview.
warn - Preview features are not covered by semver, may introduce breaking changes, and can change at any time.
✓ 98 modules transformed.
.svelte-kit/output/client/_app/manifest.json                                  2.64kb
.svelte-kit/output/client/_app/pages/index.svelte-d436cf78.js                 0.60kb / brotli: 0.35kb
.svelte-kit/output/client/_app/pages/__error.svelte-c444bad7.js               0.96kb / brotli: 0.48kb
.svelte-kit/output/client/_app/pages/editor1.svelte-88ce929e.js               0.78kb / brotli: 0.43kb
.svelte-kit/output/client/_app/pages/about.svelte-f3b069ea.js                 0.63kb / brotli: 0.35kb
.svelte-kit/output/client/_app/pages/__layout.svelte-00e7e0e9.js              8.25kb / brotli: 2.80kb
.svelte-kit/output/client/_app/pages/[id].svelte-ba705326.js                  2.30kb / brotli: 1.07kb
.svelte-kit/output/client/_app/assets/start-8077b9bf.css                      0.18kb / brotli: 0.10kb
.svelte-kit/output/client/_app/pages/editor/[id].svelte-90646995.js           7.54kb / brotli: 2.57kb
.svelte-kit/output/client/_app/chunks/store-6a354b90.js                       7.11kb / brotli: 3.17kb
.svelte-kit/output/client/_app/assets/pages/[id].svelte-8bbebfcd.css          0.81kb / brotli: 0.34kb
.svelte-kit/output/client/_app/start-349e6335.js                              18.46kb / brotli: 5.76kb
.svelte-kit/output/client/_app/assets/pages/__layout.svelte-a2d8c395.css      9.54kb / brotli: 2.38kb
.svelte-kit/output/client/_app/assets/pages/editor/[id].svelte-9be35dcf.css   102.51kb / brotli: 16.06kb
.svelte-kit/output/client/_app/assets/pages/editor1.svelte-43766a75.css       164.10kb / brotli: 79.54kb
.svelte-kit/output/client/_app/chunks/vendor-c0b61ad3.js                      643.75kb / brotli: skipped (large chunk)

(!) Some chunks are larger than 500kb after minification. Consider:
- Using dynamic import() to code-split the application
- Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/guide/en/#outputmanualchunks
- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
vite v2.4.2 building SSR bundle for production...
✓ 27 modules transformed.
.svelte-kit/output/server/app.js   338.29kb

Run npm run preview to preview your production build locally.

> Using @sveltejs/adapter-static
> self is not defined
ReferenceError: self is not defined
    at Object.<anonymous> (/home/eramax/dev/js/myblog-svelte/node_modules/jodit/build/jodit.min.js:10:224)
    at Module._compile (node:internal/modules/cjs/loader:1095:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1124:10)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:816:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:201:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:175:25)
    at async Loader.import (node:internal/modules/esm/loader:178:24)
    at async prerender (file:///home/eramax/dev/js/myblog-svelte/node_modules/@sveltejs/kit/dist/chunks/index6.js:80:14)
    at async Object.prerender (file:///home/eramax/dev/js/myblog-svelte/node_modules/@sveltejs/kit/dist/chunks/index6.js:312:5)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

svelte.config.js

import preprocess from 'svelte-preprocess';
import adapter from '@sveltejs/adapter-static';

const config = {
	preprocess: preprocess(),

	kit: {
		target: '#svelte',
		prerender: {
			enabled: true
		},
		ssr: false,
		adapter: adapter({
			fallback: 'index.html'
		}),
		vite: {
			ssr: {
				target: 'webworker'
			},
			optimizeDeps: {
				include: []
			}
		}
	}
};

export default config;

Reproduction

In any route add

<script>
  import Jodit from "jodit";
  let area;
  Jodit.make(area});
</script>
<textarea bind:this={area} />

Logs

No response

System Info

System:
    OS: Linux 5.13 Manjaro Linux
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Memory: 17.35 GB / 31.23 GB
    Container: Yes
    Shell: 5.8 - /usr/bin/zsh
  Binaries:
    Node: 16.4.2 - /usr/bin/node
    Yarn: 1.22.10 - /usr/bin/yarn
    npm: 7.17.0 - /usr/bin/npm
  Browsers:
    Firefox: 90.0
  npmPackages:
    @sveltejs/adapter-static: ^1.0.0-next.13 => 1.0.0-next.13 
    @sveltejs/kit: ^1.0.0-next.124 => 1.0.0-next.131 
    svelte: ^3.38.3 => 3.38.3

Severity

blocking all usage of SvelteKit

Additional Information

I also tried with

   import {Jodit} from "jodit";

svelte.config.js

		vite: {
			ssr: {
				target: 'webworker'
			},
			optimizeDeps: {
				include: ['jodit']
			}
		}

and I got this error

vite v2.4.2 building SSR bundle for production...
✓ 27 modules transformed.
.svelte-kit/output/server/app.js   338.29kb

Run npm run preview to preview your production build locally.

> Using @sveltejs/adapter-static
> Named export 'Jodit' not found. The requested module 'jodit' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'jodit';
const { Jodit } = pkg;

file:///home/eramax/dev/js/myblog-svelte/.svelte-kit/output/server/app.js:2
import { Jodit } from "jodit";
         ^^^^^
SyntaxError: Named export 'Jodit' not found. The requested module 'jodit' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'jodit';
const { Jodit } = pkg;

    at ModuleJob._instantiate (node:internal/modules/esm/module_job:121:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:171:5)
    at async Loader.import (node:internal/modules/esm/loader:178:24)
    at async prerender (file:///home/eramax/dev/js/myblog-svelte/node_modules/@sveltejs/kit/dist/chunks/index6.js:80:14)
    at async Object.prerender (file:///home/eramax/dev/js/myblog-svelte/node_modules/@sveltejs/kit/dist/chunks/index6.js:312:5)
    at async adapt (file:///home/eramax/dev/js/myblog-svelte/node_modules/@sveltejs/adapter-static/index.js:17:4)
    at async adapt (file:///home/eramax/dev/js/myblog-svelte/node_modules/@sveltejs/kit/dist/chunks/index6.js:338:2)
    at async file:///home/eramax/dev/js/myblog-svelte/node_modules/@sveltejs/kit/dist/cli.js:905:5
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

[benmccann]

Closing as duplicate of #1650