Type errors on builded library

[FanilZarip]

Hi! I tried build library with vite-plugin-dts and without it.

Both build packages have type errors.
Package was created on last vue with npm create vue@latest

I also tried build on older vue version with npm create vue@3.3 and library build success. It's don't have type errors when i use my own package on older version

My test repo with dts plugin
https://github.com/FanilZarip/test-lib-build/tree/lib_build_with_dts

My test repo without dts plugin
https://github.com/FanilZarip/test-lib-build/tree/build_without_dts_plugin

[RayGuo-ergou]

Seems like a typescript issue to me (tsconfig.json).

[FanilZarip]

Seems like a typescript issue to me (tsconfig.json).

I tried updating typescript in a project created with npm create vue@3.3. Library types work.
But don't work with npm create vue@latest where tsconfig is different from tsconfig which is created in npm create with vue@3.3 tsconfig

Have you tried building a simple library with typescript types on the latest version of Vue?

[RayGuo-ergou]

I copied the tsconfig files i used to work with building an UI lib. Also you don't have to pass --build to build, I think it will build the references first. But your references seems only for development, e.g. testing and vite config file.

Here: FanilZarip/test-lib-build@lib_build_with_dts...RayGuo-ergou:test-lib-build:lib_build_with_dts

[FanilZarip]

I copied the tsconfig files i used to work with building an UI lib. Also you don't have to pass --build to build, I think it will build the references first. But your references seems only for development, e.g. testing and vite config file.

Here: FanilZarip/test-lib-build@lib_build_with_dts...RayGuo-ergou:test-lib-build:lib_build_with_dts

Hi!

I've created a library with your configs and trying to use it in a new Vue project. But there are still type errors when using it.

My repo with test library. I pack it with npm pack and install locally from /src/local_repo
https://github.com/FanilZarip/test_use_own_library

And type errors screen.

[RayGuo-ergou]

You are building with --build again. You should understand how it and tsconfig references works first.

I also recommend you to start a new project with vite create.

https://vitejs.dev/guide/

[FanilZarip]

You are building with --build again. You should understand how it and tsconfig references works first.

I also recommend you to start a new project with vite create.

https://vitejs.dev/guide/

Here I build it with your tsconfig and pack with npm pack
https://github.com/FanilZarip/test-lib-build/tree/lib_build_with_dts

Then (github link below) I use this npm package and run type checking and language-tools do not show types. I create vue project with vuejs recommended way. npm create vue@latest. It is clear project with ts. And i wait that config will run well from box.

Also if I run just vue-tsc --watch, yes it is do not show any type errors. But if i use uncorrect props value type it also do not show type error. In my screen I use BaseButton with type="out" instead of "outline" and vscode and vue-tsc do not show errors for types

https://github.com/FanilZarip/test_use_own_library/tree/test_own_lib

Yes I am beginner at TS and Library building.

[FanilZarip]

I wait correct types "primary" | "outline"

[RayGuo-ergou]

Not really sure what you mean but all working fine on my side. ( I also used pnpm create vue@latest to create the project)

Maybe you missed this, in your ui lib's package.json. You need to declare where the type file is.

  "exports": {
    ".": {
+      "types": "./dist/types/index.d.ts",
      "import": "./dist/testui.es.ts",
      "require": "./dist/testui.umd.ts"
    },
    "./styles": "./dist/style.css"
  },

[RayGuo-ergou]

also tried your repo, works fine, guessing you just missed that part.
see: https://www.typescriptlang.org/docs/handbook/declaration-files/publishing.html
for more information.

[FanilZarip]

also tried your repo, works fine, guessing you just missed that part. see: https://www.typescriptlang.org/docs/handbook/declaration-files/publishing.html for more information.

Yes, You are right. It was vite-plugin-dts problem with default tsconfig

Thanks!

[FanilZarip]

qmhc/vite-plugin-dts#323

vite-plugin-dts error explained here