CORE CONCEPTS

TypeScript

Rasengan.js provides a TypeScript-first development experience for building your React application.

It comes with built-in TypeScript support for automatically installing the necessary packages and configuring the proper settings.

New Project

create-rasengan CLI can be used to create a new TypeScript project.

Terminal
npx create-rasengan@latest my-app

During the project creation, you will be prompted to choose the language for your project. Select TypeScript to create a TypeScript project.

Existing Project

If you have an existing project and want to add TypeScript support, you have to follow the following steps:

[01]Install dependencies
First, install the following dependencies:
Terminal
@types/react-dom ```
</StepItem>
 
<StepItem
step='02'
title='Configure TypeScript'
content={`
Then, add the following \`tsconfig.json\` file to the root of your project.
`}
>
```json filename="tsconfig.json
{
"compilerOptions": {
  "baseUrl": ".",
  "target": "ES2020",
 
  /* Bundler mode */
  "moduleResolution": "bundler",
  "module": "ESNext",
  "jsx": "react-jsx",
 
  /* Aliases for intellisence */
  "paths": {
    "@/*": ["src/*"]
  }
 
},
"include": ["src", "rasengan-env.d.ts"],
 
"extends": "./node_modules/rasengan/tsconfig.base.json"
}
[03]Add Typescript Types
Finally, add the following `rasengan-env.d.ts` file to the root of your project. 
/// <reference types="rasengan/types/client" />
[04]Rename files and launch the dev server
Finally, rename your files to `.tsx` and `.ts` extensions. Then run `npm run dev` to start the development server.

bash title="Terminal" npm run dev

Static Assets
Environment Variables