CODEWITHSUNDEEP
typescriptweb-componentstenciljs
Dr. Goulu
Dr. Goulu

Reputation: 590

StencilJS : how to export custom types from a components library?

I made a library (named sphere-stencil) of Stencil components that use some custom types (in sphere.ts). The library compiles and tests without error, but when I use it in an application I have compilation errors like

TypeScript: ../sphere-stencil/dist/types/components.d.ts:12:25 Cannot find module 'sphere' or its corresponding type declarations.

even if the application doesn't use anything exported by sphere.ts

sphere.ts is in a src/utils subdir of my library, the library's tsconfig.js contains

"paths": {
  "*": ["./src/*", "./src/utils/*"]
}

If generates dist/esm/sphere.js, and dist/types/utils/sphere.d.ts

However in dist/types/components.d.ts I have

import { JobData } from "sphere";

without mention to the utils/ folder, and dist/index.js contains only

export * from './esm/index.js';

which is empty ...

what do I miss to properly export (or import) the custom types along with the library ? Thanks !

Upvotes: 1

Views: 1760

Answers (1)

Tiago
Tiago

Reputation: 11

Adding the the previous (correct) response:

Also make sure your package.json is properly configured:

{
  "main": "dist/index.cjs.js",
  "module": "dist/index.js",
  "es2015": "dist/esm/index.mjs",
  "es2017": "dist/esm/index.mjs",
  "types": "dist/types/components.d.ts",
  "collection": "dist/collection/collection-manifest.json",
  "collection:main": "dist/collection/index.js",
  "unpkg": "dist/<libname>/<libname>.esm.js",
}

where libname is what you have configured in stencil.config.json under namespace

Upvotes: 1

Related Questions