Git Product home page Git Product logo

esbuild-plugin-d.ts's Introduction

esbuild-plugin-d.ts

ESBuild plugin for compiling typescript declarations

WARNING

This plugin was made to make it easier to build declarations without running two commands simultaneously. It will add a lot of overhead to your build time and should only really be used as a last resort.

Alternatives

  • TSUP - Similar usage to this plugin, but more stable and configurable. A CLI tool wrapped around ESBuild rather than a plugin
  • Estrella

Usage

const { dtsPlugin } = require("esbuild-plugin-d.ts");
const { build } = require("esbuild");

build({
    entryPoints: ["./test/index.ts"],
    outdir: "./dist",
    plugins: [dtsPlugin({
        // Optional options here
    })]
})

The plugin uses the typescript compiler api. You don't need to enable declarations in your tsconfig.

  • Plugin does not enable incremental mode unless incremental is set to true in your tsconfig. When this is enabled, the plugin will automatically assume a tsbuildinfo file but will respect your config if set there.
    • Be aware that if you delete your dist folder and have incremental mode enabled, your declarations may not be built.

Options

  • outDir: string (DEPRECATED) - override the output directory - you should define declarationDir in your tsconfig instead. The plugin will also fall back to your tsconfig outDir or esbuild outdir
  • tsconfig: string | object - A path to your tsconfig or a tsconfig object. The plugin will automatically find your tsconfig if you don't specify one.

All other functionality is derived from your tsconfig

See tests here here

esbuild-plugin-d.ts's People

Contributors

floffah avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

esbuild-plugin-d.ts's Issues

declarationDir or outDir does not work

Hi!

This project is valuable because it can generate a declaration file as a plugin for esbuild.
Is it intentional that can't control the output destination of the type declaration file?

Minimum configuration to reproduce:
version:

node -v
v16.1.0
esbuild: 0.12.5
esbuild-plugin-d.ts: 1.0.2
typescript: 4.3.2

File structure

.
β”œβ”€β”€ node_modules
β”œβ”€β”€ build.js
β”œβ”€β”€ mod.ts
β”œβ”€β”€ package.json
β”œβ”€β”€ tsconfig.json
└── yarn.lock

tsconfig.json

{
    "compilerOptions": {
        "declaration": true,
        "declarationDir": "./dist",
    }
}

build.js

import esbuild from "esbuild";
import { dtsPlugin } from "esbuild-plugin-d.ts";
esbuild
  .build({
    entryPoints: ["mod.ts"],
    bundle: true,
    outdir: "dist",
    plugins: [dtsPlugin()],
  })
  .catch(() => process.exit(1));

Now when I build it I get the following output.

node build.js
.
β”œβ”€β”€ build.js
β”œβ”€β”€ dist
β”‚   └── mod.js
β”œβ”€β”€ mod.d.ts
β”œβ”€β”€ mod.ts
β”œβ”€β”€ package.json
β”œβ”€β”€ tsconfig.json
└── yarn.lock

The same result when outDir of tsconfig is set.
Is there a way to output the type declaration file under dist?

[plugin: dts-plugin] No config file found

image

esbuild
    .build({
      entryPoints: await globFils(),
      bundle: false,
      splitting: false,
      outdir: path.join(process.cwd(), 'dist'),
      format: 'cjs',
      platform: 'node',
      watch: !isPro && {
        onRebuild(err, result) {
          if (err) console.error(err)
        },
      },
      minify: false,
      sourcemap: false,
      color: true,
      loader: {
        '.ts': 'tsx',
        '.tsx': 'tsx',
      },
      plugins: [dtsPlugin()],
    })

Plugin doesn't generate the tsconfig.tsbuildinfo file used for incremental builds

When running yarn tsc --build I get an output tsconfig.tsbuildinfo file used the the Typescript incremental builds. Subsequent builds are much faster.

This file doesn't get generated when using esbuild-plugin-d.ts

Even if I specify the tsBuildInfoFile option, same thing.

{
  "extends": "../../tsconfig.settings.json",
  "compilerOptions": {
    "composite": true,
    "tsBuildInfoFile": "tsconfig.tsbuildinfo",
    "outDir": "lib",
    "rootDir": "src"
  },
  "include": ["src/**/*"],
  "exclude": ["src/**/*.test.ts", "src/**/*.test.tsx"]
}

i only generate .d.ts files when i switch the option "declarationMap" ;

i use esbuild-plugin-d.ts only generate generate .d.ts files when i change the ts.config.json's value "declarationMap" from TRUE to FALSE or from FALSE from TRUE:
i think it would be e issue.

if i dont change ts.config.json file, only run npm run build, the .d.ts files cant be created the secrec time!

bug: Sometimes it doesn’t generate dts correctly, I’m not sure what happened, but obviously something went wrong

image

{
  "compilerOptions": {
    "target": "ESNext",
    "lib": ["ESNext"],
    "outDir": "./dist",
    "skipLibCheck": true,
    "esModuleInterop": true,
    "strict": true,
    "module": "ESNext",
    "moduleResolution": "node",
    "sourceMap": true,
    "declaration": true,
    "declarationMap": true
  },
  "include": ["src"],
  "typedocOptions": {
    "entryPoints": ["src/index.ts"],
    "out": "docs",
    "readme": "README.md",
    "gitRemote": "origin"
  }
}

Reproducible steps

  1. git clone https://github.com/rxliuli/liuli-tools
  2. cd liuli-tools
  3. yarn
  4. yarn setup
  5. cd libs/i18next-util/dist

See error

d.ts files not built on repeated build runs

Context:
My workflow is such:
1: build -> 2: clean -> 3: build -> clean -> build -> etc...
'clean' removes all file from "dist" folder (which is the output folder)

Problem:
on step 3 (second build) d.ts files are not being created (if no files changed) or d.ts files are only created for changed files

Expectation:
build d.ts files if they are not present on disk

What I found out so far:
the problem seems to come from typescript incremental build program.
when you delete the .tsbuildinfo file before step 3, everything works

personal context:
the problem for me with that is, that i have not found a way to delete this file programmatically in a way that works for different platforms/systems (linux, windows, max), because it (the file) is located in temporary folder (/tmp/@package-scope/package-name/.esbuild/.tsbuildinfo on my system). and i'd have to guess that this folder is named differently on windows :) and even on some linux distros.

Compiler options from extended tsconfig are being ignored

In our monorepo, each package has a tsconfig that extends a shared tsconfig located at the root of the yarn workspace. It seems that the compilerOptions from the extended tsconfig are not being taken into consideration.

For example, I had to add "declarationMap": true, in order to generate sourcemaps for d.ts files even though the option is enabled in tsconfig.settings.json.

{
  "extends": "../../tsconfig.settings.json",
  "compilerOptions": {
    "declarationDir": "dist",
    "emitDeclarationOnly": true,
    "declarationMap": true,
    "rootDir": "src"
  },
  "include": ["src"]
}

const copts = ts.convertCompilerOptionsFromJson(conf.conf.compilerOptions, process.cwd()).options;

Not a big deal I guess, but simply wanted to point this out.

Thanks for that plugin! ;-)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.