Skip to content

Quick Start

Install with a package manager

sh
# npm
npm install hoci

# yarn
yarn add hoci

# pnpm
pnpm add hoci

Full import

ts
import hoci from "hoci";
import { createApp } from "vue";

const app = createApp();
app.use(hoci);
app.mount("#app");

On-demand import

Use unplugin-vue-components for on-demand component registration:

sh
npm install -D unplugin-vue-components

Configure in vite.config.ts:

ts
import vue from "@vitejs/plugin-vue";
import { HociResolver } from "hoci/resolver";
import components from "unplugin-vue-components/vite";
import { defineConfig } from "vite";

export default defineConfig({
  plugins: [
    vue(),
    components({
      resolvers: [
        HociResolver(),
      ],
    }),
  ],
});

Using in JSX

When using in jsx or tsx, import components directly:

jsx
import { HiIcon } from "hoci";
import logo from "@/assets/logo.svg";

export default defineComponent({
  setup() {
    return () => <HiIcon icon={logo} />;
  },
});