Compilation error when using template literal types -- requires TS 4

[luisfarzati]

Current Behavior

I want to use template literal types provided by TypeScript 4.1:

// index.ts
export type Hello<T extends string> = `Hello, ${T}`;

With the above code, in a blank project created with basic template, the build command ends with:

$ tsdx build
✓ Creating entry file 1.1 secs
(typescript) Error: /test/src/index.ts(1,39): syntax error TS1110: Type expected.
Error: /test/src/index.ts(1,39): syntax error TS1110: Type expected.
    at error (/test/node_modules/rollup/dist/shared/node-entry.js:5400:30)
    at throwPluginError (/test/node_modules/rollup/dist/shared/node-entry.js:11878:12)
    at Object.error (/test/node_modules/rollup/dist/shared/node-entry.js:12912:24)
    at Object.error (/test/node_modules/rollup/dist/shared/node-entry.js:12081:38)
    at RollupContext.error (/test/node_modules/tsdx/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:17237:30)
    at /test/node_modules/tsdx/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:25033:23
    at arrayEach (/test/node_modules/tsdx/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:545:11)
    at Function.forEach (/test/node_modules/tsdx/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:9397:14)
    at printDiagnostics (/test/node_modules/tsdx/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:25006:12)
    at /test/node_modules/tsdx/node_modules/rollup-plugin-typescript2/dist/rollup-plugin-typescript2.cjs.js:29260:21

Note: compilation is successful if running tsc directly.

Expected behavior

To compile without errors as when running tsc directly.

Suggested solution(s)

Not sure, probably something around using the same TypeScript version or having proper babel support for newer TypeScript 4.1 features?

Additional context

Your environment

  System:
    OS: macOS 11.0.1
    CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 10.65 GB / 64.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 12.18.4 - ~/.nodenv/versions/12.18.4/bin/node
    Yarn: 1.22.10 - ~/.nodenv/versions/12.18.4/bin/yarn
    npm: 6.14.8 - ~/.nodenv/versions/12.18.4/bin/npm
  Browsers:
    Chrome: 87.0.4280.88
    Safari: 14.0.1
  npmPackages:
    tsdx: ^0.14.1 => 0.14.1
    typescript: ^4.1.3 => 4.1.3
  npmGlobalPackages:
    tsdx: 0.14.1

[luisfarzati]

Update: I found the problem, tsdx uses its own version of TypeScript which is 3.x -- shouldn't probably use TS as a peerDependency instead?

[marjorg]

@luisfarzati Have you found a temporary workaround for this? Have some types that would be very tedious to create in another way.

[agilgur5]

Yes this is a duplicate of #926 (which partially duplicates #810). One can workaround it with resolutions per #926 (comment) .

Update: I found the problem, tsdx uses its own version of TypeScript which is 3.x -- shouldn't probably use TS as a peerDependency instead?

I didn't write that dependency relationship (there's a handful of things that don't completely work with an "all-in-one" dep), but TSDX itself as well as many of its dependencies rely on specific versions of TypeScript and TS has breaking changes with every minor, so I'm not sure if a peerDep is optimal either.

[kamalkech]

@luisfarzati can u give more details about ur idea specially i am using typescript 4.7.4 ??

"devDependencies": {
    "@size-limit/preset-small-lib": "^8.0.0",
    "@types/react": "^18.0.15",
    "@types/react-dom": "^18.0.6",
    "husky": "^8.0.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "size-limit": "^8.0.0",
    "tsdx": "^0.14.1",
    "tslib": "^2.4.0",
    "typescript": "^4.7.4"
  }