"Error: 'default' is not exported by..." when building with imported umd module

Describe the bug

I’m trying to use CKEditor in my project. They distribute the editor as a UMD module and I’m linking it to my project using npm workspaces. When I import the module in my code, I get the following error in the browser console when running the dev server:

ckeditor.svelte:2 Uncaught (in promise) SyntaxError: The requested module '/ckeditor/build/ckeditor.js' does not provide an export named 'default'

I resolved that issue by setting:

optimizeDeps: {
      include: ['ckeditor5-custom-build'],
      ...
}

However, when I try to do a production build, I get a similar error during the build process:

'default' is not exported by ckeditor/build/ckeditor.js, imported by src/components/ckeditor.svelte
file: /home/zrean/projects/kookbook/src/components/ckeditor.svelte:2:7
1: <script>
2:   import BalloonBlockEditor from 'ckeditor5-custom-build'
          ^
3:   import { onMount, createEventDispatcher } from 'svelte'
4:   import FirebaseStorageAdapter from '../libs/firebaseStorageAdapter'
error during build:
Error: 'default' is not exported by ckeditor/build/ckeditor.js, imported by src/components/ckeditor.svelte
    at error (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:5308:30)
    at Module.error (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:9717:16)
    at Module.traceVariable (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:10105:29)
    at ModuleScope.findVariable (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:8875:39)
    at FunctionScope.findVariable (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:2658:38)
    at ChildScope.findVariable (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:2658:38)
    at ReturnValueScope.findVariable (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:2658:38)
    at ChildScope.findVariable (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:2658:38)
    at MemberExpression.bind (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:6564:49)
    at CallExpression.bind (/home/zrean/projects/kookbook/node_modules/rollup/dist/shared/rollup.js:2745:23)

I would expect the production build to work since the dev build work perfectly fine. I’m having a hard time figuring out why this is happening and any help would be appreciated!

Reproduction

You can clone my repo and build it. The issue will be apparent: https://github.com/TheSimpleZ/kookbook

Use the add-vite branch, run npm i and then npm run build. Running npm run dev works perfectly fine.

System Info

Output of npx envinfo --system --npmPackages vite,@vitejs/plugin-vue --binaries --browsers:

System:
    OS: Linux 4.19 Ubuntu 20.04.1 LTS (Focal Fossa)
    CPU: (8) x64 Intel(R) Core(TM) i7-7700K CPU @ 4.20GHz
    Memory: 1.45 GB / 7.77 GB
    Container: Yes
    Shell: 5.8 - /usr/bin/zsh
  Binaries:
    Node: 14.16.0 - /usr/local/bin/node
    Yarn: 1.22.4 - /mnt/c/Program Files (x86)/Yarn/bin/yarn
    npm: 7.6.3 - /usr/local/bin/npm
  npmPackages:
    @sveltejs/vite-plugin-svelte: ^1.0.0-next.5 => 1.0.0-next.5 
    vite: ^2.1.2 => 2.1.2

Used package manager: npm

Logs

Logs with the debug flag are quite long and will probably make this post hard to read. The most relevant parts are shown above. If you need more details, please use the repo I linked.

Before submitting the issue, please make sure you do the following

• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
• Provide a description in this issue that describes the bug.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.

[realityfilter]

I found the same problem with our private code base. Is this a bug or simply a necessary configuration step for vite?

[fardolieri]

I just stumbled upon this error when I updated vite from version 2.4 to 2.7. My error is caused by a named export and not a default export though.

error during build:
Error: 'SharedArray' is not exported by ../shared-project/lib/index.js, imported by main-project/index.ts
    at error (/workspace/pvs/client/node_modules/rollup/dist/shared/rollup.js:158:30)
    at Module.error (/workspace/pvs/client/node_modules/rollup/dist/shared/rollup.js:12354:16)

shared-project is a private package in my monorepo, that I symlinked using

// main-project/package.json
"shared-project": "file:../shared-project",

With vite version 2.4 my vite and vite build commands worked fine using this config

// old vite.config.ts
{
  plugins: [vue()],
  optimizeDeps: {
    include: ['shared-project'],
  },
  build: {
    commonjsOptions: { exclude: ['shared-project'] },
    // commonjsOptions: { },                               // Edit: 
  },                                                       // I just realized, that this line of code would have been
}                                                          // sufficient. I didn't need the `exclude` from above. I
                                                           // guess that means I abused a bug, that was fixed now.

With version 2.7 I get the error above. I tracked the breaking change down to this commit (#5111) from version 2.6, but I don’t really understand why it’s a breaking change. I just know, that when I include include: [] in my commonjsOptions config it works again.

// new vite.config.ts
{
  plugins: [vue()],
  optimizeDeps: {
    include: ['shared-project'],
  },
  build: {
    commonjsOptions: { exclude: ['shared-project'], include: [] }, // <----
    // commonjsOptions: { include: [] },                                          // Edit:
  },                                                                              // This works just as well.
}

Edit:

It looks like I abused a bug before, that was now fixed. But I still don’t understand why I can’t use vite build without commonjsOptions: { include: [] }