@lunarxyz/core #

@lunarxyz/core 是一个基于 Vue3 Composition API 的组合式工具包，主要目的是简化 Lunarxyz App 相关生态在功能层面的开发成本。

使用这个包的时候，会假设你已经熟悉了 Composition API 的基本概念 。

当前版本：

安装 #

默认都是通过工程化项目引入，在使用之前，需要集成到你的项目依赖里：

yarn add @lunarxyz/core

或者使用你更习惯的 npm ：

npm i @lunarxyz/core

按需引入 #

这是一个 Fully Tree Shakeable 的包（术语解释：Tree shaking ）。

所以需要你在 .vue 组件或者 .js / .ts 文件里按需导入，这样编译器会在构建的时候丢弃没有被引用的模块，可以有效的减少打包后的项目体积。

<script setup lang="ts">
// 这里的 `{ useRandom }` 就是按需导入需要的模块
import { useRandom } from '@lunarxyz/core'
</script>

在每个 API 的使用说明里都有具体的使用例子。

类型声明 #

这也是一个 Type Strong 的包，提供了完善的 TypeScript 类型声明。

使用 TS 友好的编辑器开发时（ e.g. VSCode ），编辑器可以帮你自动推导每个 API 的类型。

当你不清楚具体用法的时候，也可以按住 Ctrl + 左键 点击 API 名称可以跳转到 .d.ts 文件查看声明及注释。

CDN #

如果特殊情况下需要在手写的 HTML 页面里使用这个包，也可以通过 CDN 的方式引入：

• 使用 UNPKG

<script src="https://unpkg.com/@lunarxyz/core"></script>

• 使用 jsDelivr

<script src="https://cdn.jsdelivr.net/npm/@lunarxyz/core"></script>

CDN 引入的方式可以通过全局变量 lunarxyzCore 操作所有的 API 。

但需要注意的是，这个包在构建的时候进行了外部依赖的排除，因此在引入这个包的时候也必须引入对应依赖的 CDN ，并且保持在 @lunarxyz/core 前面。

例如要使用 useAxios ，则必须先引入 Axios 的 CDN ，使用 Vue 相关的也是如此:

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/axios"></script>
<script src="https://unpkg.com/@lunarxyz/core"></script>

而使用独立实现的功能则无需引入其他库（ e.g. useDataType ）。