I encountered this line of code in a vue project here https://github.com/InfinetyEs/Nova-Filemanager/blob/c6595c29e23cab01be6b7e37a069b13844397c91/resources/js/modules/Image.vue#L42:

import Viewer from 'v-viewer/src/component.vue';

I know from other examples that v-viewer is the dependency, so src/component.vue isn't part of this project. However, those other examples are only importing the dependency, i.e. import Viewer from 'v-viewer'.

The issue I'm facing is that npm run dev is complaining that it cannot find the dependency and I have practically 0 experience with vue.

What is the proper way to write the above so that it is pulling component.vue from the dependency v-viewer?

Thank you!

UPDATE: I wrote this import { component } from 'v-viewer' and it compiled. Appreciate if someone can confirm and explain if what I'm doing is correct.

CodePudding user response：

The project relies on v-viewer internals, which is a dangerous thing to do because they aren't guaranteed to exist.

This is the case here. There is loose version constraint, "v-viewer": "^1.4.2", and src was removed in later versions. You can either fix it to be "v-viewer": "1.4.2", or import and use it like shown in the documentation:

import { component as Viewer } from "v-viewer"

The latter solution is more preferable because this is the way the package was designed to be used without relying on its internals.