---
title: "安装"
description: "学习如何将 @movk/core 集成到您的 TypeScript 项目中，并开始使用其强大的功能。"
seo_title: "Installation"
seo_description: "Install @movk/core with your preferred package manager and start importing tree-shakable TypeScript utilities into your project in minutes."
canonical_url: "https://core.mhaibaraai.cn/docs/getting-started/installation"
---
# 安装

> 学习如何将 @movk/core 集成到您的 TypeScript 项目中，并开始使用其强大的功能。

## 开始

通过您喜欢的包管理器将 `@movk/core` 添加到您的项目中。

```bash [pnpm]
pnpm add @movk/core
```

```bash [yarn]
yarn add @movk/core
```

```bash [npm]
npm install @movk/core
```

```bash [bun]
bun add @movk/core
```

## 用法

> \[\!TIP\]
> 
> @movk/core
> 
>  是完全模块化的，支持按需导入，所有函数都支持 Tree-Shaking。

### 在 TypeScript/JavaScript 项目中使用

```typescript [utils.ts]
import { camelCase, chunk, debounce, parseUrl } from '@movk/core'

// 数组操作
const items = [1, 2, 3, 4, 5, 6]
const chunked = chunk(items, 2) // => [[1, 2], [3, 4], [5, 6]]

// 异步控制
const handleSearch = debounce((query: string) => {
  console.log('Search:', query)
}, 300)

// URL 处理
const url = parseUrl('https://example.com/path?foo=bar')
console.log(url.pathname) // => '/path'

// 字符串转换
const text = camelCase('hello-world') // => 'helloWorld'
```

### 在 Vue 项目中使用

在 Vue 项目中，除了通用工具函数外，还可以使用组合式函数：

```vue [MyComponent.vue]
<script setup lang="ts">
import { debounce, upperFirst, useAppStorage } from '@movk/core'
import { ref } from 'vue'

// 使用通用工具函数
const text = ref('hello world')
const capitalizedText = upperFirst(text.value) // => 'Hello world'

const handleInput = debounce(() => {
  console.log('Debounced input')
}, 300)

// 使用 Vue 组合式函数
const appState = useAppStorage('app-state', {
  theme: 'dark',
  count: 0
})

function increment() {
  appState.value.count++
}
</script>
```

> \[\!NOTE\]
> 
> 所有函数都支持 Tree-Shaking。在生产构建中，只有您实际导入和使用的代码才会被打包。


## Sitemap

See the full [sitemap](/sitemap.md) for all pages.