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,
});

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