Discussion on: Creating a Vue module with Rollup and Typescript

[Jesús Escamilla]

That's looks ok, how are you importing and setting the components? I see there is a type mismatch in the error

[Simon Marcel Linden]

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 {

}

[Simon Marcel Linden]

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:

import MyComponents from @ simon.marcel.linden / ExampleComponents';

Vue.config.productionTip = false
// Vue.use (lNavbar);

I then get the following error

Syntax Error: Error: No ESLint configuration found in 'packagename/dist'

Any idea how I can fix this?

[Jesús Escamilla]

The new error seems to be the app requires eslint in some process, do you have installed locally or globally?

[Simon Marcel Linden]

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.

[Jesús Escamilla]

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.

[Simon Marcel Linden]

thanks for the tip, I'll try this and report me

[Simon Marcel Linden]

@jesus9ias , great tip. It's work fine.

thanks a lot