Version

3.2.16

Reproduction link

codesandbox.io

Steps to reproduce

This code is generating an import that does not work in ESM: https://github.com/vuejs/vue-next/blob/87c86e4cc29ce3d09c11f27c7ba0eb13e7353b6c/packages/compiler-core/src/codegen.ts#L422-L428

The error is:

Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import '/project/node_modules/vue/server-renderer' is not supported resolving ES modules imported from /project/dist/server/server.mjs
Did you mean to import vue/server-renderer/index.js?

What is expected?

The generated code should be:

import { ssrRenderComponent, ssrRenderSuspense, ssrRenderVNode, ssrRenderAttrs, ssrRenderAttr } from "vue/server-renderer/index.mjs"

What is actually happening?

The generated code is:

import { ssrRenderComponent, ssrRenderSuspense, ssrRenderVNode, ssrRenderAttrs, ssrRenderAttr } from "vue/server-renderer"

Ok... this actually has a bigger implication than it seems, because without adding an exports field to vue there is no way to retain the same vue/server-renderer import path for both CJS and ESM. And we need to do that because Vite currently converts the ESM-based SSR code to CJS in its runtime.

For now you can pass this option to change the import location

Fixed in 3.2.18