question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

npm package must not be shipped with TypeScript source code

See original GitHub issue

Issue and Steps to Reproduce

npm package MUST NOT be shipped with TypeScript source code and instead ship a bundled JS file and TypeScript definition files instead (.d.ts files)

This is important because importing the module from the package causes the TypeScript compiler to link against the source code inside the npm package, which is not desirable:

import { OidcProvider } from '@axa-fr/react-oidc';

image

Which causes the project to pick up errors from transitive dependency:

image

Notice that the TypeScript compile errors came from the @openid/appauth project, not the react-oidc code itself.

Versions

6.5.5

Screenshots

Provided above

Expected

Importing from react-oidc project resolves to the TypeScript definition files (.d.ts) not the .ts source code themselves

Actual

Importing from react-oidc project resolves to the .ts source code of the project itself, which is not desirable

Additional Details

A library author might have a faulty import or might only provide typescript files for his library and not transpiled code.

libraries shouldn’t publish *.ts files,

https://github.com/microsoft/TypeScript/issues/40426

  • Installed packages:

TypeScript 4.8.3

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
guillaume-chervetcommented, Sep 14, 2022

Thank you again @ryanelian for your awesome feedback. I have revert to CommonJS and published a fixed version.

1reaction
ryaneliancommented, Sep 13, 2022

Also, something kind of related to producing JS output for the package…

image

If you do this, the package would be optimized for build systems (since almost everyone are writing React codes using Babel / Next.js / webpack / some kind of build tools) anyway.

ES2015 output will reduce the package size. Babel / etc. usually consume them to produce ES5 codes if needed anyway. You can even probably dial that up to ES2017 so that async codes are preserved (so that TypeScript won’t generate awaiter function on every files, saving more file size).

ESNext module will ensure that bundlers such as webpack / etc. can perform tree-shaking optimization (removing codes that aren’t really used).

I recommend using these options instead of ES5 + CommonJS.

Read more comments on GitHub >

github_iconTop Results From Across the Web

npm will not ignore my TypeScript source code file no matter ...
I've been unable to exclude the TypeScript source code from the npm package, and there are other *.ts files that seem to get...
Read more >
example-typescript-package - npm
This is an example TypeScript Package ready to be published on npm. It has been set up with automated tests and package publishing...
Read more >
Documentation - Publishing - TypeScript
If your types are generated by your source code, publish the types with your source code. Both TypeScript and JavaScript projects can generate...
Read more >
You may not need a bundler for your NPM library
I'd recommend just compiling your code with tsc , no bundler involved. This way, you can develop with typescript, it will output js...
Read more >
Step by step: Building and publishing an NPM Typescript ...
In this guide, we will build a reusable module in Typescript and publish it as a ... We don't want the source code,...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found