How to create Vue package that imports another component

After some rather exhaustive googling and experimentation, I believe the problem you are seeing has to do more with how imported packages work when added from a local folder (pre-published to npm or not added from npm) versus packages that are added via npm or yarn.

The biggest clue to figure this out was the two instances of Vue, which triggers the error in your update.

[Vue warn]: resolveComponent can only be used in render() or setup().

Running down that error, was not so much helpful in and of itself, however, the information that it is happening due to two Vue instances (like you also mentioned finding), was key. It seems that this occurs with local implementations of npm packages. So the solution is to do one or a combination of the following:

A) Find a testing workflow for use in the development of the package that doesn't require you to install the package in a traditional sense and instead import it from a local folder that lives outside of your testing area. Or, build your testing/docs app into your package repo. This way you can build normally without version bumping every little change and only publish and bump versions when you are truly ready.

Then test the usage of your package with a full install from the published npm source as a separate step only after you publish each new version.

B) Locally publish your file using npm pack or yarn pack. This will create a .tgz file. You can use it in your project by adding/installing it from the local path. npm install local-path-to\your-cool-package.tgz or yarn add local-path-to\your-cool-package.tgz. This comes with the caveat that for every change you want to see in your testing app, you will have to remove and re-install it pointing to the new version bump it will append to your file name. You can't simply save and publish to that same file to see updates. You have to bump each change.

Obviously, this is a bit of a clunky workflow, but it works. Perhaps it could be a medium step between a full publish to npm to test a build change. But it seems like, to me anyway, not having worked on packages much personally, that A is a slightly better workflow than B.

Here are some related posts that explain more about similar duplicate Vue with npm install/link/pack and how they work differently for local packages:

Bundling a plugin with Rollup but having duplicate Vue.js package imported in the client app's bundle (Nuxt)

Difference between npm link x and npm install /path/to/x