Getting Started

The basic development environment requires Node.js version 18 or above.

You can directly run npx create-antd-layout@latest your-project to install. It provides many pre-configured templates, making setup quick and convenient.

Installation Method 2

Integrate into an existing project.

  1. Add @adminui.dev/antd-layout to your project
npm i @adminui.dev/antd-layout
pnpm i @adminui.dev/antd-layout
yarn add @adminui.dev/antd-layout
bun add @adminui.dev/antd-layout
Copied!
  1. Add the required dependencies
package.json 
"dependencies": {
    "@adminui-dev/antd-layout": "^1.7.8",
    "@ant-design/colors": "^7.2.1",
    "nprogress": "^0.2.0",
    "antd": "^6.1.1",
    "react": "^19.2.0",
    "react-dom": "^19.2.0",
    "react-intl": "^8.0.4",
    "react-router": "^7.11.0",
    "react-router-dom": "^7.11.0",
    ...
}
Copied!
  1. Use and configure the component in your layout file
src/layouts/index.tsx 
// src/layout/index.tsx
...
import { AntdLayout } from "@adminui-dev/antd-layout"
...
export default function(){      
    return(
        <>
            <AntdLayout layoutConfig={...} menuData={...} />
        </>
    )
}
Copied!

Prerequisites: Node, ant-design, react, and react-dom environment are required.