How do I run a node script in a typescript react project?

Question

I have a React project, and it includes talking to an API.

I have a module defined in the project that abstracts away the api access.

So for example it has methods like addFoo and getFoos. I would like to use this module from a script that I would like to run directly on the command line. The purpose of the script is to load a bunch of data into a database via the api.

When I use plain .js, it seems to be fairly easy to just run > node path/to/file. The relative import paths work fine.

Issue

When I use .ts it doesn't work. It complains that it can't find the module.

Question
What's the right way to run a .ts CLI script in a React project directly? Or is this the wrong way to do this?

Thanks !

nodejs doesn't understand ts. you should translate it to js before use it. — dunhuang
– dunhuang, Commented Aug 8, 2020 at 3:28
Hi, install ts-node. It should get you sorted. See this answer on stackoverflow — MwamiTovi
– MwamiTovi, Commented Aug 8, 2020 at 6:05

corsair · Accepted Answer · 2020-08-08 15:18:12Z

3

MwamiTovi's response above was close however I additionally had to set {"module": "commonjs"}.

ts-node -O '{"module":"commonjs"}' src/tools/foo.ts

answered Aug 8, 2020 at 15:18

corsair

4075 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Dimas Lanjaka · Accepted Answer · 2025-08-04 06:39:08Z

3

add ts-node property to your tsconfig.json. For example below:

{
  "ts-node": { // ts-node automated configuration using commonjs
    "compilerOptions": {
      "module": "CommonJS"
    }
  },
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "strictNullChecks": false,
    "isolatedModules": false,
    "allowUnreachableCode": true,
    "noImplicitAny": false,
    "noEmit": false,
    "outDir": "dist",
    "jsx": "react-jsx"
  },
  "include": ["./src", "./*.json", "./*.ts", "snapshot3.js"],
  "typeAcquisition": { "enable": true },
  "exclude": ["**/node_modules/**", "**/tmp/**", "**/build/**", "**/dist/**"]
}

then run single tsx file:

ts-node to/single/file.tsx

when you need some options to ts-node just modify tsconfig.json property ts-node

OR using direct ts-node ESM experimental without removing {"type": "module"} in package.json

cross-env-shell NODE_ENV=development node --experimental-specifier-resolution=node --loader ts-node/esm -r dotenv/config "src/to/file.ts"

cross-env-shell NODE_ENV=development is optional

edited Aug 4 at 6:39

answered Oct 3, 2022 at 14:59

Dimas Lanjaka

3232 silver badges12 bronze badges

4 Comments

cupiqi09 Over a year ago

Thanks a lot, that completely did the trick for me! Didn't have to set any other options.

Dimas Lanjaka Over a year ago

yeah, no need setup anything. just add ts-node property and run ts-node to/single/file.tsx and done.

cupiqi09 Over a year ago

@Djima: nope, without setting modules to CommonJS it doesn't work since create-react-app sets modules to "esnext"

Dimas Lanjaka Over a year ago

this also works

cross-env-shell NODE_ENV=development node --experimental-specifier-resolution=node --loader ts-node/esm -r dotenv/config "src/to/file.ts"

Collectives™ on Stack Overflow

How do I run a node script in a typescript react project?

2 Answers 2

Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related