Ant Design Pro Layout

Install

# yarn
yarn add @ant-design-vue/pro-layout
# npm
npm i @ant-design-vue/pro-layout -S

Basic Usage

First, you should add the icons that you need into the library.

import { createApp } from 'vue'
import ProLayout, { PageContainer } from '@ant-design-vue/pro-layout';

const app = createApp();

app.use(ProLayout)
    .use(PageContainer)
    .mount('#app')

After that, you can use pro-layout in your Vue components as simply as this:

<template>
    <pro-layout>
        <router-view />
    </pro-layout>
</template>

or TSX

import ProLayout from '@ant-design-vue/pro-layout'

export default defineComponent({
    setup () {
        return (): JSX.Element => (
            <ProLayout>
                <RouterView />
            </ProLayout>
        )
    }
})

Build project

npm run generate # Generate files to ./src
npm run compile # Build library
npm run test # Runing Test