Rasengan Logo
Rasengan Logo
  • Docs
  • Blog
  • Showcase
  • Support us
Using stable versionv1.2.0
Documentation
Packages
Templates
Rasengan UI Kit
Using stable versionv1.2.0
Documentation
Packages
Templates
Rasengan UI Kit

API REFERENCE

rasengan.config.js

Rasengan.js can be configured through a rasengan.config.js file in the root of your project directory with a default export.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig({ /* your config */ });

Configuration as a Function

You can also pass a function to defineConfig to do some dynamic configuration.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig(() => { // You can do some dynamic configuration here return { /* your config */ } });

Async Configuration

You can also return a Promise from the function to do async configuration.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig(async () => { // You can do some async configuration here return { /* your config */ } });

Configuration Options

ssr

Rasengan.js will use the ssr option to determine whether to use SSR or not. By default, it is set to true to enable SSR but you can set it to false to disable SSR and work in SPA mode.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig({ ssr: false, });

prerender

Introduced in v1.2.0, the prerender option lets you configure the pre-rendering mode (SSG) for your application. It's either a boolean or an object containing a routes parameter giving you the possibility to set the list of routes you want to pre-render statically.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig({ prerender: true, });

or

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig({ prerender: { routes: ['/', '/about', '/contact', '/blog/**], }, });

sageMode

Introduced in v1.2.0, the sageMode option lets you configure from now the react compiler mode.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig({ sageMode: { reactCompiler: true }, });

Lean more about React Compiler.

server.development.port

You can use the server.development.port option to set the port for the development server by overriding the default port.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig({ server: { development: { port: 3000, } } });

By running npm run dev, the development server will be available at http://localhost:3000.

server.development.open

You can use the server.development.open option to open the browser automatically when the development server starts.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig({ server: { development: { open: true, } } });

vite.plugins

You can use the vite.plugins option to add Vite plugins to your project and enable extra features.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; import mdx from '@rasenganjs/mdx/plugin'; export default defineConfig({ vite: { plugins: [mdx()] } });

vite.resolve.alias

You can use the vite.resolve option to configure Vite's resolve.alias option.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig({ vite: { resolve: { alias: [ { find: '~', replacement: '/src' } ] } } });

And then you can use the alias in your code like this:

src/pages/index.tsx
jsimport { Avatar } from '~/components/avatar';

vite.resolve.symbole

You can use the vite.resolve.symbole option to configure Vite's resolve.symbole option. This is useful because by default, Rasengan.js is using module aliases with @ as the alias for the src directory. You can decide to change the alias to something else.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; export default defineConfig({ vite: { resolve: { symbole: '_', } } });

And then you can use the alias in your code like this:

src/pages/index.tsx
jsimport { Avatar } from '_/components/avatar';
[name].router.tsx
Create Rasengan CLI

ON THIS PAGE

Configuration as a Function
Async Configuration
Configuration Options
ssr
prerender
sageMode
server.development.port
server.development.open
vite.plugins
vite.resolve.alias
vite.resolve.symbole
Rasengan Logo
Rasengan Logo

Resources

  • Docs
  • Packages
  • Blog
  • Showcase
  • Support us

Community

  • Github
  • X (Twitter)

Subscribe to the Newsletter

Stay informed to the news about rasengan.js including new releases, events, etc...

© 2024-2026 Rasengan Labs, All rights reserved.