developit / microbundle

📦 Zero-configuration bundler for tiny modules.
https://npm.im/microbundle
MIT License
8.06k stars 361 forks source link

Typescript declaration files gets built in incorrect directory #854

Open abubakir1997 opened 3 years ago

abubakir1997 commented 3 years ago

I have three projects, Project A, Project B, and Project C that looks something like this:

Project A

// package.json
{
  "main": "build/index.js",
  "module": "build/index.modern.js",
  "types": "build/index.d.ts",
  "source": "src/index.ts",
}

The project outputs the declaration file correctly inside build/index.d.ts

Project B

// package.json
{
  "main": "build/index.js",
  "module": "build/index.modern.js",
  "types": "build/index.d.ts",
  "source": "src/index.ts",
  "dependencies": {
    "@my-workspace/project-a": "^1.0.0",
  },
}

The project INCORRECTLY outputs the declaration file inside build/project-b/src/index.d.ts.

Project C

// package.json
{
  "main": "build/index.js",
  "module": "build/index.modern.js",
  "types": "build/index.d.ts",
  "source": "src/index.ts",
  "dependencies": {
    "@my-workspace/project-b": "^1.0.0",
  },
}

This project fails to build because it can't find the declaration file for @my-workspace/project-b.

Issue

In my actual project I have 12 packages in a yarn workspace / lerna environment. The issue randomly happens for some projects and not others even though they all have the same microbundle and typescript config setup.

rschristian commented 3 years ago

Can you check that the same thing happens using raw TSC? (yarn tsc)

TSC keeps the module structure, which can lead to odd instances like this. AFAIK, rollup-plugin-typescript2, which we use, keeps this behavior.

If TSC doesn't produce the issue, it's likely an upstream thing, but if it does, it's just an overall TS thing. You'll need to have a simple post-build script to rename/move stuff around.

ovidius72 commented 3 years ago

Same problem

ovidius72 commented 3 years ago

I'm sorry. In my case the problem was not related to microbundle. I was accidentally importing a file outside the src directory causing the compiler to copy out the whole src directory in the dist folder.

zeekrey commented 3 years ago

I feel like I'm having the same issue. With this config:

 "main": "./dist/components.umd.js",
  "module": "./dist/components.module.js",
  "exports": "./dist/components.modern.js",
  "source": "src/index.ts",

Microbundle puts the declaration file under this directory:

image

Because of this, TS can not find the correct typings.

Edit: This project is part of a monorepo. Not sure if this issue relates to this.

christopher-caldwell commented 3 years ago

I also had this issue, but it was because of my tsconfig. If you include more than one directory, it puts the types in said directory.

I had:

{
  "include": ["src", "test"]
}

Which resulting in the build output putting the declaration files in the src and test folders under the dist. I had to use 2 different configs to solve this. Pretty easy to extend the first and change the includes to add test.

jkilzi commented 3 years ago

I've been facing the same issue, setting the declarationDir option in the tsconfig.json solved the problem. My setup looks like this:

//package.json
{
  ...
  "main": "./dist/index.js",
  "module": "./dist/index.modern.js",
  "source": "./src/index.ts",
  "types": "./dist/src/index.d.ts",
  ...
}

//tsconfig.json
{
  "compilerOptions": {
    "outDir": "./dist",
    "declarationDir": "./dist",
    ...
  }
  "include": ["src/**/*"],
  "exclude": [
    "./src/**/setupTests.ts",
    "./src/**/integration",
    "./src/**/*.{test,spec}.{ts,tsx,js,jsx}"
  ]
}

Before this workaround the output dir contained the declarations inside dist/src/src/**/*.d.ts instead of dir/src/**/*.d.ts

crherman7 commented 2 years ago

Similarly happening to me as well - the reason being is that I was relying on a root tsconfig "paths" attribute for access to workspaces packages. This has an effect on how individual packages were bundled - my index.d.ts was bundled to a nested directory. The "paths" attribute allows me not to have a monorepo tool for dependency graph.

I wasn't a huge fan of the approach of copying the declaration file up to the root bundled outDir i.e. similarly to https://github.com/preactjs/signals/blob/55d5becbb41c2faec62b9588937f8c74f0d65152/package.json#L14 or https://github.com/preactjs/signals/blob/55d5becbb41c2faec62b9588937f8c74f0d65152/package.json#L15.

Instead I just use a simple monorepo tool like turborepo for my dependency graph and then when using microbundle to bundle I use a local tsconfig.build.json with --tsconfig cmd line arg. The index.d.ts gets put in the correct root of the bundled outDir.

jamesbrune commented 1 year ago

I had to set "rootDir": "./src", in my tsconfig. I'm in an nx monorepo and if I didn't set that it would try to get it from the base tsconfig I was extending from and so I'd end up with dist/src/libs/[project]/src/index.d.ts but yeah setting the rootDir to src fixed it for me.