Skip to content

Can't import CJS deep import #1438

@jods4

Description

@jods4

This is similar to many deep import bugs, which are closed.
There's currently #1041 that is open, but it seems the cause there is linking.
This looks exactly like #1067, which was closed because its author was "lucky" having access to ESM sources.

Describe the bug

I'm trying to use prismjs and include the csharp language grammar.
Here's my module:

import Prism from "prismjs";
export default Prism;
await import("prismjs/components/prism-csharp");

Note that prismjs is entirely written in Common JS style (and even worse: uses global variables, hence the await import()).

When I try to import this module, Vite says this on the console:

22:22:09 [vite] Internal server error:
  Plugin: vite:imports
  File: /App/prism.ts
  Error: Deep import "prismjs/components/prism-csharp" should be avoided because dependency "prismjs" has been pre-optimized. Prefer importing directly from the module entry: 

  import { ... } from "prismjs"

  If the used import is not exported from the package's main entry and can only be attained via deep import, you can explicitly add the deep import path to 
"optimizeDeps.include" in vite.config.js.

So I followed the instruction and added optimizeDeps: { include: [ "prismjs/components/prism-csharp"] } to my config, which changed nothing.

I tried anything that came to mind, like adding .js to the path, trying exclude: ["prismjs"], nothing worked.

From the comments in #1067 I have the impression that you can't exclude this lib from pre-opt because it's written in CommonJS style.
That issue seem to be the same bug but it was closed without a fix (workaround was to load a ESM source instead... when available).

System Info

  • vite version: 2.0.0-beta.12
  • Operating System: Win 10
  • Node version: 15
  • Package manager and version: npm 7

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions