Transpiling local package dependencies that use TS file as entry point

[karolisvram]

Hi, consider a monorepo that has some TypeScript packages kept in packages/*. Now one of these packages, let's call it b, depends on package a. Package a has entry point set as TS file e.g. src/index.ts.. When trying to bundle such package microbundle fails since it cannot transpile package a as it's declared as a dependency of b and thus it's expected that the package is already bundled up.

I could think of the following solutions:

1. Only use published npm packages as dependency.
2. Always point main entry to bundle e.g. dist/index.js.
3. Keep using TS files as main entry but when bundling, use bundled version i.e. dist/index.js.

I have prepared a small sample monorepo illustrating the issue https://github.com/karolisvram/packages-publishing-sample/ but so far haven't decided on the best solution as all have drawbacks. Ideally, mirobundle would transpile its local dependencies too but as far as I can tell, it's not supported? Any there any other alternatives that I'm missing?

[developit]

If you're bundling a dependency, it shouldn't be listed in "dependencies" - that would download it while also downloading the bundled copy of it. If you move the dependency to "devDependencies", Microbundle will inline it and TypeScript will be transpiled.

[karolisvram]

Doesn't seem like that's the case. I have all package dependencies listed as devDependnecies i.e:

{
  "name": "@cashew/b",
  "version": "1.0.0",
  "main": "src/index.ts",
  "source": "src/index.ts",
  "maindist": "dist/index.js",
  "moduledist": "dist/index.esm.js",
  "typesdist": "dist/index.d.ts",
  "typings": "dist/index.d.ts",
  "license": "MIT",
  "devDependencies": {
    "@cashew/a-js": "workspace:*",
    "@cashew/a-ts": "workspace:*",
    "@types/node": "^10.3.2",
    "microbundle": "^0.13.1",
    "typescript": "^4.3.2"
  },
  "scripts": {
    "start": "ts-node src/index.ts",
    "build": "tsc",
    "build:watch": "tsc --watch",
    "bundle": "microbundle build -i src/index.ts -f es,cjs --compress true -o dist/index.js"
  }
}

This is my TS config:

{
  "compilerOptions": {
    "lib": ["esnext"],
    "moduleResolution": "node",
    "declaration": true,
    "importHelpers": true,
    "module": "ESNext",
    "outDir": "./lib",
    "allowJs": true,
    "target": "ESNext",

    "allowSyntheticDefaultImports": true,
    // Improve compatibility with babel compiled modules
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "resolveJsonModule": true,
    // We only use TypeScript for type checking
    "noEmit": true,
    // Third party types are sometimes incompatible with each other without
    // causing problems in our own application code
    "skipLibCheck": true,

    "sourceMap": true,
    "removeComments": true,

    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "strictFunctionTypes": true,
    "noImplicitThis": true,
    "alwaysStrict": true,

    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true
  }
}

But when I try to bundle, package that has its entry set as TS file does not compile, as in screenshot:

This is a demo replicating the problem, try running yarn first to install all dependencies and then yarn bundle for this package https://github.com/karolisvram/packages-publishing-sample/tree/main/packages/b .

[rschristian]

@karolisvram Looks like you accidentally made that demo private

[karolisvram]

Apologies 😬 I made it public.

[rschristian]

For tracking; probably a duplicate of #808