how to use ts with 11ty?

[yolio2003]

i follow the document and the gist

  eleventyConfig.addExtension([ "11ty.jsx", "11ty.ts", "11ty.tsx" ], {
    key: "11ty.js",
  });

but only get error

> node --require esbuild-register node_modules/.bin/eleventy

SyntaxError: missing ) after argument list
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1027:15)
    at Module._compile (node:internal/modules/cjs/loader:1063:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Object.newLoader (/Users/monkeytao/Documents/sub-tc/tc/node_modules/.pnpm/[email protected][email protected]/node_modules/esbuild-register/dist/node.js:2262:9)
    at Object.extensions..js (/Users/monkeytao/Documents/sub-tc/tc/node_modules/.pnpm/[email protected][email protected]/node_modules/esbuild-register/dist/node.js:4807:24)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
    at node:internal/main/run_main_module:17:47

i think it's not clear for us to add ts support smoothly, can any one get some help ?

[pdehaan]

Not sure if it helps, but I was looking through that Gist the other week and created a simple repo version which might help: https://github.com/pdehaan/11ty-ts

[danielrob]

You have a syntax error somewhere, but the config snippet you provided doesn't have a syntax error, so it's going to be hard for people to help you with this one AFAICT...

[danielrob]

P.S. this might help.

[yolio2003]

Strangely, I get this error with any of the above methods, even re-clone 11ty-ts

pnpm i esbuild -D

{
  "scripts": {
    "build": "node --require esbuild-register $(npm bin)/eleventy"
  },
  "devDependencies": {
    "@11ty/eleventy": "^2.0.0",
    "@types/vhtml": "^2.2.4",
    "esbuild": "^0.17.11",
    "esbuild-register": "^3.4.2",
    "typescript": "^4.9.5",
    "vhtml": "^2.2.0"
  }
}

pnpm run build

> [email protected] build /Users/monkeytao/Documents/sub-tc/11ty-ts
> node --require esbuild-register $(npm bin)/eleventy

SyntaxError: missing ) after argument list
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1027:15)
    at Module._compile (node:internal/modules/cjs/loader:1063:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Object.newLoader (/Users/monkeytao/Documents/sub-tc/11ty-ts/node_modules/.pnpm/[email protected][email protected]/node_modules/esbuild-register/dist/node.js:2262:9)
    at Object.extensions..js (/Users/monkeytao/Documents/sub-tc/11ty-ts/node_modules/.pnpm/[email protected][email protected]/node_modules/esbuild-register/dist/node.js:4807:24)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
    at node:internal/main/run_main_module:17:47

Node.js v17.9.1
 ELIFECYCLE  Command failed with exit code 1.

[pdehaan]

Oh, I don't use pnpm. Does it work w/ vanilla npm?
I also just learned that they removed $(npm bin) in more recent versions of npm (npm/cli#5459), so that'd need to revert back to ./node_modules/.bin/eleventy and I'll update my repo shortly.

[yolio2003]

hey, thx !

npm just works, not sure the rootcause yet.
i think there should have a bug, it's not about the $(npm bin), because node_modules/.bin/eleventy is also have same issue.

[zachleat]

for official pnpm support please subscribe to #2876 otherwise #577 is the home base for typescript discussions!

thank you!

This is an automated message to let you know that a helpful response was posted to your issue and for the health of the repository issue tracker the issue will be closed. This is to help alleviate issues hanging open waiting for a response from the original poster.

If the response works to solve your problem—great! But if you’re still having problems, do not let the issue’s closing deter you if you have additional questions! Post another comment and we will reopen the issue. Thanks!