快速开始

axue框架极小，只有200kb，默认全量导入，不提供繁琐的单个导入体验。

一、引入和注册

ESM 方式

适合需要编译构建工具（如 Vite、Webpack）的大型项目，通过包管理器安装并导入 axue。

1. 安装组件库

在项目中使用 npm 或 yarn 安装 axue 框架：

npm i axue@latest --save

2. 初始化框架

在代码中导入并初始化 axue，向浏览器注册组件：

import { init } from "axue"; 
init();

CDN 方式

适合无需编译的快速集成场景，直接通过 <script> 标签加载 axue 框架，支持模块化（mjs）和传统（UMD）两种格式。

1. 模块化引入（ESM）

在 HTML 文件中使用 <script type="module"> 加载 axue 的 mjs版本模块，适合现代浏览器：

<script type="module">   
	import { init } from "https://unpkg.com/axue/dist/axue.mjs";   
	init(); 
</script>

2. 传统引入（UMD）

通过 <script> 标签加载 axue 的 UMD格式文件，框架会暴露全局变量 Axue：

<script src="https://unpkg.com/axue/dist/axue.umd.js"></script>
<script>  
    document.addEventListener("DOMContentLoaded", () => {    
    	Axue.init();
	}); 
</script>

二、使用

使用组件

在init()之后，在html中，或者在vue、react等前框框架模板中使用标签，像使用<div>那样自由

<div>
    <axue-logo-close></axue-logo-close>
</div>

使用API

1、使用全局变量

在初始化之后，弹框系列API会统一挂载在window.axueAPI对象上

axueAPI.showTip.send('Hello, axue!');

在你喜欢的js逻辑中，调起Tip弹框

2、ESM具名导入

如果是大型编译型项目，你也可以具名导入

import {showTip} from "axue";    
showTip.send('Hello, axue!');