open-index/open-npm huggingface dataset:
npm package: @sumdoo/pro-cli
Description: sumdoo-pro-cli of sumdoo project
Latest version: 1.0.3-beta

# @sumdoo/pro-cli

`@sumdoo/pro-cli` 是一个开发环境依赖。它是一个 `npm` 包，局部安装在每个 `@sumdoo/cli` 创建的项目中。

CLI 服务是构建于 `vite` 之上的。它包含了：

- 针对项目开发所需用到的 `vite` 配置
- 提供 `dev` 、`build`、`preview`、`lint`、`upload` 命令

## 项目配置

```js
// 项目下创建 sumdoo.config.js
module.exports = {
    /** 标识项目类型，更能针对性的处理一些插件相关的东西 */
    project_type: 'admin' | 'h5' | 'uniapp'

    /** 项目网页标题 */
    project_title: string

    /** 注入 G, 填写开发时请求路径、打包时默认转换成注入模式 */
    inject_G?: string | () => string

    /** 开启后端注入应用基础路径：应用多版本场景 */
    enable_app_base?: boolean

    // svg 图标目录
    icon_dirs?: string 

// -- Vite 配置 -------------------------------------------------------------------------------------

    // 公共基础路劲
    base?: string

    // 请求端口
    port?: number

    // 监听 IP 地址
    host?: string | boolean

    // 请求代理
    proxy?: Record<string, string | ProxyOptions>
    
    // 文件路径加载别名
    alias?: Record<string, string>

    // sass 配置
    sass_resource?: string 
    
    // 自动导入 hooks 的库
    auto_import_hooks_lib?: string[]

    /** 分隔代码 */
    manualChunks?: ManualChunksOption 

// -- 拉取后端 api 文件的配置 ----------------------------------------------------------------------

    pull_apis?: {
        /** 请求路径 */
        request: string 
        /** 写入磁盘路径 */
        output : string
    }[]

// -- 上传 cos 配置 ----------------------------------------------------------------------

    upload_cos?: {
        /** 上传密钥id */
        secret_id   : string
        /** 上传密钥key */
        secret_key  : string
        /** 存储桶名称 */
        bucket      : string
        /** 存储桶所在地域 */
        region      : string
        /** 项目路径 (以存储桶为根路径 目录“/” 分隔) */
        project_path: string
    }
}
```
npm package: @sumdoo/pro-element-plus
Description: 基于 ElementPlus 二次封装组件库
Author: 朱国华
Latest version: 1.0.0

# @sumdoo/pro-jexcel

## 使用方式

- 使用 `useProjexcel`

```ts
import { useProJexcel } from '@sumdoo/pro-jexcel'
import { ref } from 'vue'

const jexcel_ref = ref()
const $jexcel = useProJexcel(jexcel_ref, jexcel_options)
```

- 使用 `defineProJexcel`

```ts
import { defineProJexcel } from '@sumdoo/pro-jexcel'

const [jexcel_ref, jexcel_options] = defineProJexcel({})
```

```html
<SdProJexcel ref="jexcel_ref" v-bind="jexcel_options" />
```
npm package: @sumdoo/pro-jexcel
Description: 基于 jspreadsheet-ce 实现的 Vue3 电子表格组件
Author: 朱国华
Latest version: 0.0.6

# @sumdoo/pro-jexcel

## 使用方式

- 使用 `useProjexcel`

```ts
import { useProJexcel } from '@sumdoo/pro-jexcel'
import { ref } from 'vue'

const jexcel_ref = ref()
const $jexcel = useProJexcel(jexcel_ref, jexcel_options)
```

- 使用 `defineProJexcel`

```ts
import { defineProJexcel } from '@sumdoo/pro-jexcel'

const [jexcel_ref, jexcel_options] = defineProJexcel({})
```

```html
<SdProJexcel ref="jexcel_ref" v-bind="jexcel_options" />
```
npm package: @sumdoo/pro-wangeditor
Description: 基于 wangeditor 实现的 Vue3 富文本编辑器
Author: 朱国华
Latest version: 0.0.5

# @sumdoo/pro-wangeditor

基于 wangeditor 实现的 Vue3 富文本编辑器，扩展异步创建使用。

## 使用方式

- 组件方式

```ts
import { SdProEditorToolbar, SdProEditor } from '@sumdoo/pro-wangeditor'
import { shallowRef, ref } from 'vue'

const editor_ref = shallowRef() // @wangeditor/editor 该库要求必须使用 shallowRef
const html = ref('')
function onEditorCreated(editor: any) {
    editor_ref.value = editor
}
```

```html
<div class="editor" >
    <SdProEditorToolbar :editor="editor_ref" />
    <SdProEditor
        v-model="html"
        style="height: 400px;"
        @created="onEditorCreated"
    />
</div>
```

- Hook 方式

```ts
import { useWangEditor } from '@sumdoo/pro-wangeditor'
import { ref } from 'vue'

const toolbar_ref = ref()
const editor_ref  = ref()
const html        = ref('')
useWangEditor({
    toolbar    : toolbar_ref,
    editor     : editor_ref,
    modelValue : html,
    mode: 'simple'
})
```

```html
<div class="editor" >
    <div ref="toolbar_ref" />
    <div ref="editor_ref" style="height: 400px;" />
</div>
```
npm package: @sumdoo/pro-webdatarocks
Description: 基于 WebDataRocks 实现的 Vue3 透视表组件
Author: 朱国华
Latest version: 1.0.1

# @sumdoo/pro-webdatarocks

## 如何使用

```ts
import { SdProWebdatarocks } from '@sumdoo/pro-webdatarocks'
```

```html
<SdProWebdatarocks report="https://cdn.webdatarocks.com/reports/report.json" />
```