how to import .vue files from node_modules

[rhinonan]

I need import some .vue files from node_modules.

import CloudsecTopNav from '@sxf/cloudsec-components/src/packages/top-nav/index.vue';

but I got error

 [vite] Internal server error: Failed to resolve entry for package "D:\Code\xsec\ui\node_modules\@sxf\cloudsec-components\src\packages\alarm". The package may have incorrect main/module/exports specified in its package.json.
  Plugin: vite:import-analysis
  File: D:/Code/xsec/ui/node_modules/@sxf/cloudsec-components/src/packages/top-nav/index.vue

I was use vue-cli before. In vue-cli , we can use transpileDependencies: ['@sxf/cloudsec-components']。

So, how can i import .vue files from node_modules with vite-plugin-vue2 or vite?

[rhinonan]

use relative path with ../ like import CloudsecAlert from '../node_modules/@sxf/cloudsec-components/src/packages/alert/index.vue'; it's worked.

any better solution?

[antfu]

In your @sxf/cloudsec-components, you should define

exports: {
  "./*": "./*"
}

in your package.json to expose the nested files.

[screetBloom]

After trying all the methods I finally solved my problem completely with @originjs/vite-plugin-commonjs, it will help you

@rhinonan