search

ionic-team / stencil

A toolchain for building scalable, enterprise-ready component systems on top of TypeScript and Web Component standards. Stencil components can be distributed natively to React, Angular, Vue, and traditional web developers from a single, framework-agnostic codebase.
https://stenciljs.com
Other
12.56k stars 787 forks source link

bug: 3rd party imports do not resolve in components.d.ts #5168

Open womblep opened 11 months ago

womblep commented 11 months ago

Prerequisites

Stencil Version

4.8.2

Current Behavior

We are integrating a third-party library from Cisco (https://developer.webex-cx.com/documentation/guides/desktop/#javascript-sdk-and-modules) to a component.

The build works the first time we run it.

Second and subsequent times we get lots of errors complaining about missing modules or types. For example:

[ ERROR ]  TypeScript: node_modules/@wxcc-desktop/sdk-types/agentx/app/components/EmpyResponsiveWidget.d.ts:2:28
           Cannot find module 'lit-element' or its corresponding type declarations.

      L1:  import "@agentx/agentx-mfe-wc-based";
      L2:  import { LitElement } from "lit-element";
      L3:  export declare class EmptyResponsiveWidget extends LitElement {

The build can be made to work one of 2 ways:

  1. delete components.d.ts each time before building
  2. add import {Desktop} from "@wxcc-desktop/sdk"; to components.d.ts

obviously number 2 keeps being overwritten each build.

Expected Behavior

The build works every time.

System Info

System: node 20.7.0
    Platform: windows (10.0.22631)
   CPU Model: AMD Ryzen 7 5800X 8-Core Processor              (16 cpus)
    Compiler: D:\xxxxxx\stencil-error-report-1\node_modules\@stencil\core\compiler\stencil.js
       Build: 1702322155
     Stencil: 4.8.2
  TypeScript: 5.2.2
      Rollup: 2.42.3
      Parse5: 7.1.2
      Sizzle: 2.42.3
      Terser: 5.26.0

Steps to Reproduce

  1. generated a blank stencil project
  2. added webexcc libaries to package.json as described here https://developer.webex-cx.com/documentation/guides/desktop/#javascript-sdk-and-modules
  3. added some lines to my-component.tsx to import the library

Code Reproduction URL

https://github.com/womblep/stencil-webexcc-issue

Additional Information

No response

rwaskiewicz commented 11 months ago

Thanks for the issue! I was able to confirm that this is an issue with the minimal reproduction you provided. I'm going to get this added to our internal backlog.

In the interim, a workaround here might be to add skipLibCheck: true (docs link) to your tsconfig.json to prevent type checking of .d.ts files