Hello, I wrote and exported some components. Now i have the following problem if i install and import this components to another project.
No overload matches this call.
The last overload gave the following error.
Type 'PluginFunction<any>' is not assignable to type 'VueConstructor<Vue> | FunctionalComponentOptions<any, PropsDefinition<any>> | ComponentOptions<never, any, any, any, any, Record<...>> | AsyncComponentPromise<...> | AsyncComponentFactory<...>'.
Type 'PluginFunction<any>' is not assignable to type 'AsyncComponentPromise<any, any, any, any>'.
Types of parameters 'Vue' and 'resolve' are incompatible.
Type '(component: Component<any, any, any, any>) => void' is missing the following properties from type 'VueConstructor<Vue>': extend, nextTick, set, delete, and 10 more.
I export the components in my package ("@ simon.marcel.linden / ExampleComponents") in the index.ts under src / lib-components as follows
export { default as component1 } from '@/lib-components/component1/component1.vue';
export { default as component2 } from '@/lib-components/component2/component2.vue';
export { default as component3 } from '@/lib-components/component3/component3.vue';
And then I import them in another project
import { Component, Vue } from "vue-property-decorator";
import {component1} from "@simon.marcel.linden/ExampleComponents";
import {component2} from "@simon.marcel.linden/ExampleComponents";
@Component({
components: {
component1,
component2,
}
})
export default class AwesomePackage extends Vue {
}
Hi @jesus9ias
, I updated vue-sfc-rollup to the latest version and copied my components. Now it seems to be working. It's strange. I haven't changed anything in my code.
Currently, I am importing the components all individually as shown in my example above. If I want to import everything at once, I do this as follows:
Hello @simonmarcellinden
in that case you can try to test locally using npm pack and install them referencing the created tgz file instead of npm link. It is more similar to installing from public npm.
Hello, I wrote and exported some components. Now i have the following problem if i install and import this components to another project.
Hi @simonmarcellinden , what Vue version are you using in the components and project? I think it's a version problem.
Hello @jesus9ias I am currently using Vue version 2.6.12 and the following versions of Typescript and co
That's looks ok, how are you importing and setting the components? I see there is a type mismatch in the error
I export the components in my package ("@ simon.marcel.linden / ExampleComponents") in the index.ts under src / lib-components as follows
And then I import them in another project
Hi @jesus9ias , I updated vue-sfc-rollup to the latest version and copied my components. Now it seems to be working. It's strange. I haven't changed anything in my code.
Currently, I am importing the components all individually as shown in my example above. If I want to import everything at once, I do this as follows:
I then get the following error
Syntax Error: Error: No ESLint configuration found in 'packagename/dist'
Any idea how I can fix this?
The new error seems to be the app requires eslint in some process, do you have installed locally or globally?
Hello, is installed locally and globally. But it looks like a problem with
npm link
. Before I publish my packages, I always test them.
To do this, I use
npm link
and then link my package with my test project. The error mentioned above then appears.
But if I publish the package and then install it with
npm install
the error disappears.
Hello @simonmarcellinden in that case you can try to test locally using npm pack and install them referencing the created tgz file instead of npm link. It is more similar to installing from public npm.
thanks for the tip, I'll try this and report me
@jesus9ias , great tip. It's work fine.
thanks a lot