open-index/open-npm huggingface dataset:
npm package: @plugilo/easy-email-editor
Description: Email editor
Author: plugilo dev
Latest version: 5.0.1

# Easy-email-editor

## Introduction

Email render and preview container.

## usage

```sh
$ npm install --save easy-email-editor
```

or

```sh
$ yarn add easy-email-editor
```

```js
import React from 'react';
import { BlockManager } from '@plugilo/easy-email-core';
import { EmailEditor, EmailEditorProvider } from '@plugilo/easy-email-editor';
import 'easy-email-editor/lib/style.css';

const initialValues = {
  subject: 'Welcome to Easy-email',
  subTitle: 'Nice to meet you!',
  content: BlockManager.getBlockByType(BasicType.PAGE).create({}),
};

export function App() {
  return (
    <EmailEditorProvider
      data={initialValues}
      height={'calc(100vh - 72px)'}
    >
      {({ values }) => {
        return <EmailEditor />;
      }}
    </EmailEditorProvider>
  );
}
```
npm package: @plugilo/easy-email-extensions
Description: Email editor
Author: m-Ryan
Latest version: 5.0.1

# Easy-email-extensions

## usage

```sh
$ npm install --save easy-email-extensions
```

or

```sh
$ yarn add easy-email-extensions
```

```js
import React from 'react';
import { BlockManager, BasicType, AdvancedType } from '@plugilo/easy-email-core';
import { EmailEditor, EmailEditorProvider } from '@plugilo/easy-email-editor';
import { ExtensionProps, StandardLayout } from '@plugilo/easy-email-extensions';

import 'easy-email-editor/lib/style.css';
import 'easy-email-extensions/lib/style.css';

const categories: ExtensionProps['categories'] = [
  {
    label: 'Content',
    active: true,
    blocks: [
      {
        type: AdvancedType.TEXT,
      },
      {
        type: AdvancedType.IMAGE,
        payload: { attributes: { padding: '0px 0px 0px 0px' } },
      },
      {
        type: AdvancedType.BUTTON,
      },
      {
        type: AdvancedType.SOCIAL,
      },
      {
        type: AdvancedType.DIVIDER,
      },
      {
        type: AdvancedType.SPACER,
      },
      {
        type: AdvancedType.HERO,
      },
      {
        type: AdvancedType.WRAPPER,
      },
    ],
  },
  {
    label: 'Layout',
    active: true,
    displayType: 'column',
    blocks: [
      {
        title: '2 columns',
        payload: [
          ['50%', '50%'],
          ['33%', '67%'],
          ['67%', '33%'],
          ['25%', '75%'],
          ['75%', '25%'],
        ],
      },
      {
        title: '3 columns',
        payload: [
          ['33.33%', '33.33%', '33.33%'],
          ['25%', '25%', '50%'],
          ['50%', '25%', '25%'],
        ],
      },
      {
        title: '4 columns',
        payload: [['25%', '25%', '25%', '25%']],
      },
    ],
  },
];

const initialValues = {
  subject: 'Welcome to Easy-email',
  subTitle: 'Nice to meet you!',
  content: BlockManager.getBlockByType(BasicType.PAGE)!.create({}),
};

export default function App() {

  return (
    <EmailEditorProvider
      data={initialValues}
      height={'calc(100vh - 72px)'}
      autoComplete
      dashed={false}
    >
      {({ values }) => {
        return (
          <StandardLayout
            categories={categories}
            showSourceCode={true}
          >
            <EmailEditor />
          </StandardLayout>
        );
      }}
    </EmailEditorProvider>
  );
}

```
npm package: @plugin-123/my-f-plugin
Description: Register global imports on demand for Vite and Webpack
Latest version: 0.0.3

# unplugin-starter

[![NPM version](https://img.shields.io/npm/v/unplugin-starter?color=a1b858&label=)](https://www.npmjs.com/package/unplugin-starter)

Starter template for [unplugin](https://github.com/unjs/unplugin).

## Template Usage

To use this template, clone it down using:

```bash
npx degit antfu/unplugin-starter my-unplugin
```

And do a global replace of `unplugin-starter` with your plugin name.

Then you can start developing your unplugin 🔥

To test your plugin, run: `pnpm run dev`
To release a new version, run: `pnpm run release`

## Install

```bash
npm i unplugin-starter
```

<details>
<summary>Vite</summary><br>

```ts
// vite.config.ts
import Starter from 'unplugin-starter/vite'

export default defineConfig({
  plugins: [
    Starter({ /* options */ }),
  ],
})
```

Example: [`playground/`](./playground/)

<br></details>

<details>
<summary>Rollup</summary><br>

```ts
// rollup.config.js
import Starter from 'unplugin-starter/rollup'

export default {
  plugins: [
    Starter({ /* options */ }),
  ],
}
```

<br></details>


<details>
<summary>Webpack</summary><br>

```ts
// webpack.config.js
module.exports = {
  /* ... */
  plugins: [
    require('unplugin-starter/webpack')({ /* options */ })
  ]
}
```

<br></details>

<details>
<summary>Nuxt</summary><br>

```ts
// nuxt.config.js
export default {
  buildModules: [
    ['unplugin-starter/nuxt', { /* options */ }],
  ],
}
```

> This module works for both Nuxt 2 and [Nuxt Vite](https://github.com/nuxt/vite)

<br></details>

<details>
<summary>Vue CLI</summary><br>

```ts
// vue.config.js
module.exports = {
  configureWebpack: {
    plugins: [
      require('unplugin-starter/webpack')({ /* options */ }),
    ],
  },
}
```

<br></details>
npm package: @plugin-cra-proxy/core
Description: Example plugin for Rsbuild.
Latest version: 0.0.2

# @plugin-cra-proxy/core

Example plugin for Rsbuild.

<p>
  <a href="https://npmjs.com/package/@plugin-cra-proxy/core">
   <img src="https://img.shields.io/npm/v/@plugin-cra-proxy/core?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version" />
  </a>
  <img src="https://img.shields.io/badge/License-MIT-blue.svg?style=flat-square&colorA=564341&colorB=EDED91" alt="license" />
  <a href="https://npmcharts.com/compare/@plugin-cra-proxy/core?minimal=true"><img src="https://img.shields.io/npm/dm/rsbuild-plugin-example.svg?style=flat-square&colorA=564341&colorB=EDED91" alt="downloads" /></a>
</p>

## Usage

Install:

```bash
npm add @plugin-cra-proxy/core -D
```

## Options

## License

[MIT](./LICENSE).
npm package: @plugin-cra-proxy/rsbuild
Description: A development proxy plugin for **Rsbuild**, mimicking [Create React App](https://create-react-app.dev/) proxy behavior.
Latest version: 0.0.3

# @plugin-cra-proxy/rsbuild

A development proxy plugin for **Rsbuild**, mimicking [Create React App](https://create-react-app.dev/) proxy behavior.

It allows you to:

- Proxy all HTTP requests that are not handled by the dev server.
- Proxy custom WebSocket requests, while ignoring Vite HMR WS connections.
- Automatically fix Windows localhost loopback issues.
- Compatible with Rsbuild development servers.

<p>
  <a href="https://npmjs.com/package/@plugin-cra-proxy/rsbuild">
   <img src="https://img.shields.io/npm/v/@plugin-cra-proxy/rsbuild?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version" />
  </a>
  <img src="https://img.shields.io/badge/License-MIT-blue.svg?style=flat-square&colorA=564341&colorB=EDED91" alt="license" />
  <a href="https://npmcharts.com/compare/@plugin-cra-proxy/rsbuild?minimal=true"><img src="https://img.shields.io/npm/dm/rsbuild-plugin-example.svg?style=flat-square&colorA=564341&colorB=EDED91" alt="downloads" /></a>
</p>

## Usage

Install:

```bash
npm add @plugin-cra-proxy/rsbuild -D
```

Add plugin to your `rsbuild.config.ts`:

```ts
// rsbuild.config.ts
import { pluginCraProxy } from "@plugin-cra-proxy/rsbuild";

export default {
  plugins: [pluginCraProxy()],
};
```

## Options

## License

[MIT](./LICENSE).
npm package: @plugin-cra-proxy/vite
Description: A development proxy plugin for **Vite** mimicking [Create React App](https://create-react-app.dev/) proxy behavior.
Latest version: 0.0.3

# @plugin-cra-proxy/vite

A development proxy plugin for **Vite** mimicking [Create React App](https://create-react-app.dev/) proxy behavior.

It allows you to:

- Proxy all HTTP requests that are not handled by the dev server.
- Proxy custom WebSocket requests, while ignoring Vite HMR WS connections.
- Automatically fix Windows localhost loopback issues.
- Compatible with both Vite development servers.

<p>
  <a href="https://npmjs.com/package/@plugin-cra-proxy/vite">
   <img src="https://img.shields.io/npm/v/@plugin-cra-proxy/vite?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version" />
  </a>
  <img src="https://img.shields.io/badge/License-MIT-blue.svg?style=flat-square&colorA=564341&colorB=EDED91" alt="license" />
  <a href="https://npmcharts.com/compare/@plugin-cra-proxy/vite?minimal=true"><img src="https://img.shields.io/npm/dm/rsbuild-plugin-example.svg?style=flat-square&colorA=564341&colorB=EDED91" alt="downloads" /></a>
</p>

## Usage

Install:

```bash
npm add @plugin-cra-proxy/vite -D
```

Add plugin to your `vite.config.ts`:

```ts
// rsbuild.config.ts
import { pluginCraProxy } from "@plugin-cra-proxy/vite";

export default {
  plugins: [pluginCraProxy()],
};
```

## Options

## License

[MIT](./LICENSE).
npm package: @plugin-light/cli
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/cli">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/cli">   <img src="https://img.shields.io/npm/v/@plugin-light/cli">   <img src="https://img.shields.io/npm/l
Author: novlan1
Latest version: 1.0.16

# 本地发布

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/cli">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/cli">
  <img src="https://img.shields.io/npm/v/@plugin-light/cli">
  <img src="https://img.shields.io/npm/l/@plugin-light/cli">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

可以在 `nodejs` 或 `bash` 中使用。

## 1. 作者

**novlan1**

## 2. 如何使用

安装

```bash
pnpm add @plugin-light/cli -D
```

在 `nodejs` 中使用

```ts
const { PUBLISH_SCRIPT: publishUtil } = require('@plugin-light/cli');

publishUtil [prod|test]
```

在 `bash` 中使用

```bash
# 工具暴露 light-cli 命令
npx light-cli publish `[prod|test]`
```

## 3. 默认值

```ts
export const DEFAULT_PUBLISH_OPTIONS = {
  port: '3005',
  method: 'POST',
  path: '/web-publish/publish',
} as const;
```

## 4. 环境变量

| 变量                         | 对应名称 |
| ---------------------------- | -------- |
| VUE_APP_LOCAL_PUBLISH_HOST   | host     |
| VUE_APP_LOCAL_PUBLISH_PORT   | port     |
| VUE_APP_LOCAL_PUBLISH_METHOD | method   |
| VUE_APP_LOCAL_PUBLISH_PATH   | path     |

## 5. 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/const
Description: 常量定义
Author: novlan1
Latest version: 0.1.6

# 常量定义

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/const">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/const">
  <img src="https://img.shields.io/npm/v/@plugin-light/const">
  <img src="https://img.shields.io/npm/l/@plugin-light/const">
  <img src="https://img.shields.io/badge/TypeScript-strict-blue?logo=typescript&logoColor=white" alt="TypeScript strict">
  <img src="https://img.shields.io/badge/created-2022--01-blue?logo=github&logoColor=white">
</p>

公共常量定义。

## 1. 作者

**novlan1**

## 2. 如何使用

安装：

```bash
pnpm add @plugin-light/const
```

使用：

```ts
import { getCdnList, NPM_PACKAGES_LIST } from '@plugin-light/const';

```

## 3. 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/import-meta-resolve
Description: 路径解析
Author: novlan1
Latest version: 1.0.1-beta.0

# 路径解析

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/import-meta-resolve">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/import-meta-resolve">
  <img src="https://img.shields.io/npm/v/@plugin-light/import-meta-resolve">
  <img src="https://img.shields.io/npm/l/@plugin-light/import-meta-resolve">
  <img src="https://img.shields.io/badge/TypeScript-strict-blue?logo=typescript&logoColor=white" alt="TypeScript strict">
  <img src="https://img.shields.io/badge/created-2022--01-blue?logo=github&logoColor=white">
</p>

[import-meta-resolve](https://www.npmjs.com/package/import-meta-resolve) 的 `CJS` 版本，可供不支持 `ESM` 的项目使用。

## 1. 作者

**novlan1**

## 2. 如何使用

安装

```bash
pnpm add @plugin-light/import-meta-resolve -D
```

使用

```js
import { resolve } from '@plugin-light/import-meta-resolve';

console.log(resolve('./index.js', import.meta.url))
```

## 3. 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/mcp-setup
Description: 一键交互式安装 PMD 团队常用的 CodeBuddy MCP 配置
Author: novlan1
Latest version: 1.0.2

# MCP 快速配置

> 🚀 一键交互式安装 MCP 配置（支持 CodeBuddy / CodeBuddy 插件）

团队成员只需运行一条命令，即可交互式选择 IDE 插件、配置 MCP Server，自动写入对应的 `mcp.json`。

## 使用方式

```bash
npx @plugin-light/mcp-setup
```

## 支持的 IDE 插件

| IDE 插件 | 配置路径 |
|----------|---------|
| **CodeBuddy** | `~/.codebuddy/mcp.json` |
| **CodeBuddy 插件** | `~/.gongfeng-copilot/mcp.json` |

## 支持的 MCP Server

| MCP | 说明 | 需要 Token |
|-----|------|:---------:|
| **PMD MCP** | 项目发布工具（H5/小程序/NPM 发布、文件上传、PB 转 TS 等） | ✅ `enterpriseId` + `pmdRtoken` |
| **Press MCP** | Press UI 组件文档查询与发布 | ✅ `enterpriseId` + `pmdRtoken` |
| **KM** | KM 知识库搜索与读取 | ✅ `taiPAT` |
| **iWiki** | iWiki 知识库搜索与读取 | ✅ `taiPAT` |
| **工蜂 (Gongfeng)** | 工蜂代码仓库操作（搜索项目、MR、Issue、文件读写等） | ✅ `taiPAT` |
| **TAPD** | TAPD 需求/缺陷/任务管理 | ✅ `tapdToken` |
| **TDesign MCP** | TDesign 组件文档查询（支持 Vue/React/UniApp/小程序） | ❌ |

> 💡 相同的占位符（如 `enterpriseId`、`taiPAT`）只需输入一次，会自动复用到所有用到该值的 MCP。

## 功能特性

- 🖥️ **多 IDE 支持**：可同时配置 CodeBuddy 和 CodeBuddy 插件，一次输入多处写入
- 🎯 **交互式选择**：可选择安装全部或部分 MCP
- 🔑 **安全输入**：Token 输入时以 `*` 遮蔽，不会明文显示
- 📦 **智能合并**：自动检测并保留已有配置
- 💾 **自动备份**：写入前自动备份原配置为 `mcp.json.backup`
- 🚫 **零依赖**：仅使用 Node.js 内置模块，无需额外安装

## 运行流程

```mermaid
flowchart TD
    A["�️ Step 0: 选择目标 IDE 插件"] --> B["📋 Step 1: 选择要安装的 MCP Server"]
    B --> C["🔑 Step 2: 逐个配置 Token\n（同一占位符只问一次）"]
    C --> D["👀 Step 3: 预览写入计划\n（分别展示每个 IDE 的变更）"]
    D --> E["✅ 确认写入"]
    E --> F["💾 逐个 IDE 备份 + 合并写入"]
    F --> G["🎉 配置完成，重启 IDE 生效"]
```

## Token 获取方式

### PMD MCP / Press MCP

| 占位符 | 说明 | 获取方式 |
|--------|------|---------|
| `<enterpriseId>` | 企业微信 ID | 如 `zhangsan` |
| `<pmdRtoken>` | PMD rtoken | [研发平台 → Token 管理 → 创建](https://mobile.aow.com/rd-platform-web/#/management/token) |

### KM / iWiki / 工蜂

| 占位符 | 说明 | 获取方式 |
|--------|------|---------|
| `<taiPAT>` | TAI 个人访问令牌（`tai_pat_xxx`） | [TAI → 个人访问令牌 → 创建](https://tai.it.aow.com/user/pat) |

### TAPD

| 占位符 | 说明 | 获取方式 |
|--------|------|---------|
| `<tapdToken>` | TAPD 个人令牌 | [TAPD → 我的主页 → 个人令牌](https://tapd.aow.com/platform/myhome?not_direct=1&from=mcp#tab=tab-mytoken) |

## 扩展新的 MCP

只需编辑 `bin/mcp-template.json`：

```mermaid
flowchart LR
    A["在 mcpServers 中\n添加新配置"] --> B["用 placeholder 占位符标记\n需要用户输入的值"]
    B --> C["在 _placeholders 中\n添加占位符说明"]
    C --> D["运行 npx @plugin-light/mcp-setup\n自动识别新 MCP"]
```

无需修改 `setup.mjs` 代码。

## 发布

```bash
npm publish --access public
```

## 开发

```bash
# 本地测试
node bin/setup.mjs
```
npm package: @plugin-light/postcss-plugin-remove-selector
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/postcss-plugin-remove-selector">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/postcss-plugin-remove-selector">   <img src="https://img.shields.io/npm/v/@plugi
Author: novlan1
Latest version: 1.0.0

# 移除选择器

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/postcss-plugin-remove-selector">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/postcss-plugin-remove-selector">
  <img src="https://img.shields.io/npm/v/@plugin-light/postcss-plugin-remove-selector">
  <img src="https://img.shields.io/npm/l/@plugin-light/postcss-plugin-remove-selector">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

        
可用于移除三方库中的不需要的样式，从而减小包体积。

## 如何使用

安装

```bash
pnpm add @plugin-light/postcss-plugin-remove-selector -D
```

`postcss.config.js` 中新增配置：

```ts
module.exports = {
  require('@plugin-light/postcss-plugin-remove-selector/lib/index')({
    list: [{
      file: new RegExp('press-ui/press-icon-plus/css/icon.scss'),
      include: [
        'arrow',
        'arrow-left',
        'arrow-right',
        'arrow-up',
        'arrow-down',
        'success',
        'cross',
        'plus',
        'minus',
        'fail',
        'circle',
      ].map(item => `.press-icon-plus-${item}:before`),
    }],
  }),
}
```

也可以在 `vite.config.ts` 中使用：

```ts
import { defineConfig } from 'vite';
import removeSelector from '@plugin-light/postcss-plugin-remove-selector';
import {
  PRESS_ICON_PLUS_REMOVE_SELECTOR 
} from '@plugin-light/postcss-plugin-remove-selector/lib/press-ui-icon-plus';


export default defineConfig({
  css: {
    postcss: {
      plugins: [removeSelector(PRESS_ICON_PLUS_REMOVE_SELECTOR)],
    },
  },
});
```


## 类型

```ts
interface Options {
  list: Array<{
    file: RegExp | string;
    exclude?: string[];
    include?: string[];
  }>;
}
```

## 更新日志

[点此查看](./CHANGELOG.md)


## 效果

使用此插件，可使小程序大小减少`15KB`。

<img src="https://mike-1255355338.cos.ap-guangzhou.myqcloud.com/article/2025/3/own_mike_5110452c29f3a22c3a.png" width="600">

<img src="https://mike-1255355338.cos.ap-guangzhou.myqcloud.com/article/2025/3/own_mike_d5703094c04270a6d5.png" width="600">
npm package: @plugin-light/postcss-plugin-transform-web-tag
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/postcss-plugin-transform-web-tag">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/postcss-plugin-transform-web-tag">   <img src="https://img.shields.io/npm/v/@p
Author: novlan1
Latest version: 1.0.0

# 转换 Web 标签

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/postcss-plugin-transform-web-tag">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/postcss-plugin-transform-web-tag">
  <img src="https://img.shields.io/npm/v/@plugin-light/postcss-plugin-transform-web-tag">
  <img src="https://img.shields.io/npm/l/@plugin-light/postcss-plugin-transform-web-tag">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

        
可转换样式文件中的 H5 标签，到小程序可识别的标签。

## 如何使用

安装

```bash
pnpm add @plugin-light/postcss-plugin-transform-web-tag -D
```

`vite.config.ts` 中新增配置：

```ts
import transformWebTag from '@plugin-light/postcss-plugin-transform-web-tag/lib/index';

export default {
  // ...
   css: {
    postcss: {
      plugins: [transformWebTag({
        tagMap: {
          span: 'label',
          img: 'image',
          i: 'view',
          p: 'view',
          h4: 'view',
          em: 'view',
          ul: 'view',
          li: 'view',
        }
      })],
    },
  },
  //...
}
```


## 默认的 tagMap

```ts
const TAG_MAP = {
  span: 'label',
  img: 'image',
  i: 'view',
  p: 'view',
  h4: 'view',
  em: 'view',
  ul: 'view',
  li: 'view',
};
```


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/preprocess
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/preprocess">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/preprocess">   <img src="https://img.shields.io/npm/v/@plugin-light/preprocess">   <img src="https:/
Author: novlan1
Latest version: 1.0.0

# 预处理器

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/preprocess">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/preprocess">
  <img src="https://img.shields.io/npm/v/@plugin-light/preprocess">
  <img src="https://img.shields.io/npm/l/@plugin-light/preprocess">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

条件编译的底层依赖。

## 如何使用

安装

```bash
pnpm add @plugin-light/preprocess -D
```

使用

```js
import { preprocessFile, preprocessFileSync, preprocess } from '@plugin-light/preprocess';

reprocess(content, context, {
  type,
});
```


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/shared
Description: 公共包
Author: novlan1
Latest version: 1.0.20

# 公共包

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/shared">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/shared">
  <img src="https://img.shields.io/npm/v/@plugin-light/shared">
  <img src="https://img.shields.io/npm/l/@plugin-light/shared">
  <img src="https://img.shields.io/badge/TypeScript-strict-blue?logo=typescript&logoColor=white" alt="TypeScript strict">
  <img src="https://img.shields.io/badge/created-2022--01-blue?logo=github&logoColor=white">
</p>

除 `t-comm` 外，`plugin-light-shared` 是整个工具库中最底层的依赖。

## 1. 作者

**novlan1**

## 2. 如何使用

安装

```bash
pnpm add @plugin-light/shared -D
```

使用

```js
import { getDeps } from '@plugin-light/shared';

getDeps(__dirname);
```

## 3. 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/shared-vue2
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/shared-vue2">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/shared-vue2">   <img src="https://img.shields.io/npm/v/@plugin-light/shared-vue2">   <img src="http
Author: novlan1
Latest version: 1.0.1

# Vue2 公共包

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/shared-vue2">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/shared-vue2">
  <img src="https://img.shields.io/npm/v/@plugin-light/shared-vue2">
  <img src="https://img.shields.io/npm/l/@plugin-light/shared-vue2">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

Vue2 中的公共包。

## 1. 作者

**novlan1**

## 2. 如何使用

安装

```bash
pnpm add @plugin-light/shared-vue2 -D
```

使用

```js
import { parseSFC } from '@plugin-light/shared-vue2';

parseSFC(content);
```

## 3. 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/uni-read-pages-vite
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/uni-read-pages-vite">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/uni-read-pages-vite">   <img src="https://img.shields.io/npm/v/@plugin-light/uni-read-pages
Author: novlan1
Latest version: 1.0.0

# Vite 版本的路由读取

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/uni-read-pages-vite">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/uni-read-pages-vite">
  <img src="https://img.shields.io/npm/v/@plugin-light/uni-read-pages-vite">
  <img src="https://img.shields.io/npm/l/@plugin-light/uni-read-pages-vite">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

业务无需使用。

## 如何使用

安装

```bash
pnpm add @plugin-light/uni-read-pages-vite -D
```

使用

```js
import { TransformPages } from '@plugin-light/uni-read-pages-vite';

const { routes } = new TransformPages();
```


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-add-code-at-end
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-add-code-at-end">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-add-code-at-end">   <img src="https://img.shields.io/npm/v/@plugin-ligh
Author: novlan1
Latest version: 1.0.0

# 文件后增加代码

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-add-code-at-end">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-add-code-at-end">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-add-code-at-end">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-add-code-at-end">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

使用场景包括给文件增加额外的导出，比如为 Vue3 增加默认导出。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-add-code-at-end -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { addCodeAtEndVitePlugin } from '@plugin-light/vite-plugin-add-code-at-end';


export default defineConfig({
  plugins: [
    addCodeAtEndVitePlugin({
      list: [
        {
          id: 'vue.js',
          code: 'export default function(){}',
          exact: false,
        },
        {
          id: 'vue.runtime.esm-bundler.js',
          code: 'export default function(){}',
          exact: false,
          number: 1,
        },
      ],
    }),
  ],
});
```

## 参数

```ts
export type IAddCodeAtEndItem = {
  // 文件名，或文件名关键字
  id: string;
  // 要添加的代码
  code: string;
  // 是否精确匹配文件
  exact?: boolean;
  // 要匹配的文件数据，设置为 1 时，可防止重复添加
  number?: number;
};

export type IAddCodeAtEndOptions = {
  list?: Array<IAddCodeAtEndItem>;
};
```


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-alias-for-library
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-alias-for-library">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-alias-for-library">   <img src="https://img.shields.io/npm/v/@plugin-
Author: novlan1
Latest version: 1.0.0

# 三方库别名处理

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-alias-for-library">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-alias-for-library">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-alias-for-library">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-alias-for-library">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

一些三方库是以源码方式提供的，比如 `press-plus`，`Vue2.x` 时可以配置 `transpileDependencies`，但是 `Vite` 没有对应的配置项。

可以这么处理：

1. 将三方库复制到 `src` 下的某个目录下
2. 为三方库配置 `alias`，指向 `src` 某目录下
3. 配置 `tsconfig.json` 的 `compileOptions.paths`

本插件做的就是上面的第一步。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-alias-for-library -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { aliasForLibraryVitePlugin } from '@plugin-light/vite-plugin-alias-for-library';


export default defineConfig({
  plugins: [
    aliasForLibraryVitePlugin({
      list: [
        'press-ui',
        'press-plus',
      ],
      target: 'src/library',
    }),
  ],
});
```

## 参数

```ts
export type IAliasForLibraryOptions = {
  // 三方库列表
  list?: Array<string>;
  // alias 目标
  target?: string;
  // 执行路径
  root?: string;
};
```

## 其他

设置 `alias` 示例：

```ts
export default defineConfig({
  resolve: {
    alias: {
      'press-ui': path.resolve(__dirname, 'src/library/press-ui')
    }
  },
})
```


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-analyze-bundle-file-size
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-analyze-bundle-file-size">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-analyze-bundle-file-size">   <img src="https://img.shields.io/
Author: novlan1
Latest version: 1.0.0

# 产物文件大小分析

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-analyze-bundle-file-size">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-analyze-bundle-file-size">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-analyze-bundle-file-size">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-analyze-bundle-file-size">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

小程序下，对组件的模板（`wxml/qml`等）、样式（`wxss/qss`等）、脚本文件（`.js`）大小的分析。

本插件解决的痛点是，**帮助开发者快速定位哪些组件问题最大、最亟需优化**。

插件会获取每个组件（包括页面）的上述三种产物的大小，以及样式与模板的体积比例、模板与脚本的体积比例，输出为 `json` 文件和 `csv` 文件，名称前缀均为`analyze-bundle-file-size`。

开发者可以据此进行分析，一般来说，**样式模板体积比（`cssHtmlRatio`）特别大的组件（基础组件除外），往往存在大量无用样式**。

可利用 `Excel` 中的自定义排序，对 `cssHtmlRatio` 进行降序，进而确定优化目标及优先级。

<a href="https://mike-1255355338.cos.ap-guangzhou.myqcloud.com/article/2024/12/own_mike_bec1b61c4ac07795da.png">
  <img src="https://mike-1255355338.cos.ap-guangzhou.myqcloud.com/article/2024/12/own_mike_bec1b61c4ac07795da.png" width="600" />
</a>

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-analyze-bundle-file-size -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { analyzeBundleFileSizeVitePlugin } from '@plugin-light/vite-plugin-analyze-bundle-file-size';


export default defineConfig({
  plugins: [
    analyzeBundleFileSizeVitePlugin(),
  ],
});
```


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-chunk-split
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-chunk-split">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-chunk-split">   <img src="https://img.shields.io/npm/v/@plugin-light/vite-p
Author: novlan1
Latest version: 1.0.0

# 分包

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-chunk-split">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-chunk-split">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-chunk-split">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-chunk-split">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

[vite-plugin-chunk-split](https://www.npmjs.com/package/vite-plugin-chunk-split) 的 CJS 版本。


## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-chunk-split -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { chunkSplitPlugin } from '@plugin-light/vite-plugin-chunk-split';


export default defineConfig({
  plugins: [
    chunkSplitPlugin({
    }),
  ],
});
```

具体参数可以参考 [vite-plugin-chunk-split](https://www.npmjs.com/package/vite-plugin-chunk-split)，不同之处是 CustomChunk 额外暴露了 `staticImportedScan/isCSSIdentifier/getModuleInfo`。

```ts
export type CustomChunk = (context: {
  id: string,
  moduleId: string,
  file: string,
  root: string,
  staticImportedScan: StaticImportedScan,
  isCSSIdentifier: IsCSSIdentifier,
  getModuleInfo: GetModuleInfo,
}) => string | undefined | null;
```


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-cross-game-style
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-cross-game-style">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-cross-game-style">   <img src="https://img.shields.io/npm/v/@plugin-li
Author: novlan1
Latest version: 1.0.0

# 样式关键词编译

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-cross-game-style">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-cross-game-style">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-cross-game-style">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-cross-game-style">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

`scss` 链接的关键词编译，替换关键词 `@TIP_STYLE_NAME`。

可参考对应的 [Webpack Loader](./webpack-loader-cross-game-style.html)。


## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-cross-game-style -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { crossGameStyleVitePlugin } from '@plugin-light/vite-plugin-cross-game-style';


export default defineConfig({
  plugins: [
    crossGameStyleVitePlugin({
      platform: 'web'
    }),
  ],
});
```

## 参数

```ts
export type ICrossPlatformOptions = {
  // 平台名称，默认 web
  platform?: string;
};
```


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-cross-platform
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-cross-platform">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-cross-platform">   <img src="https://img.shields.io/npm/v/@plugin-light/
Author: novlan1
Latest version: 1.0.0

# 跨平台关键词编译

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-cross-platform">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-cross-platform">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-cross-platform">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-cross-platform">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

跨平台的关键词编译，替换关键词 `@TIP_PLATFORM_NAME`。

可参考对应的 [Webpack Loader](./webpack-loader-cross-platform.html)。


## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-cross-platform -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { crossPlatformVitePlugin } from '@plugin-light/vite-plugin-cross-platform';


export default defineConfig({
  plugins: [
    crossPlatformVitePlugin({
      platform: 'web'
    }),
  ],
});
```


## 参数

```ts
export type ICrossPlatformOptions = {
  // 平台名称，默认 web
  platform?: string;
};
```


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-dispatch-script
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-dispatch-script">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-dispatch-script">   <img src="https://img.shields.io/npm/v/@plugin-ligh
Author: novlan1
Latest version: 1.0.0

# 脚本分发

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-dispatch-script">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-dispatch-script">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-dispatch-script">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-dispatch-script">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

同 Webpack 版本的脚本分发插件。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-dispatch-script -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { dispatchScriptVitePlugin } from '@plugin-light/vite-plugin-dispatch-script';


export default defineConfig({
  plugins: [
    dispatchScriptVitePlugin({
    })
  ],
});
```


## 参数

```ts
export type IDispatchScriptOptions = {
  // 移动的脚本被放在分包统一的目录下，dispatchDir 为目录名称
  // 不传的话，会使用随机值
  dispatchDir?: string;

  // 禁止移动的名单列表
  blackList?: Array<string | RegExp>;

  // 强制移动的名单列表，应保证没有子依赖在主包或其他分包中中
  whiteList?: Array<string | RegExp>;
};
```


## 常见问题

如果存在 JS/TS 文件引用 Vue 文件，会导致编译异常，这种本身就是不对的，Vue 文件只能被 Vue 文件引用，不能被 JS/TS 引用。

一个常见的错误场景是函数式调用组件，引入组件时，没有加条件编译。


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-dispatch-vue
Author: novlan1
Latest version: 1.0.0

# 组件分发


<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-dispatch-vue">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-dispatch-vue">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-dispatch-vue">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-dispatch-vue">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>


同 Webpack 版本的组件分发插件。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-dispatch-vue -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { dispatchVueVitePlugin } from '@plugin-light/vite-plugin-dispatch-vue';


export default defineConfig({
  plugins: [
    dispatchVueVitePlugin({
      limit: 1,
    })
  ],
});
```

## 参数

```ts
export type IDispatchVueOptions = {
  // 组件被多少个分包使用才会移动，默认 1
  limit?: number;

  // 移动的组件被放在分包统一的目录下，dispatchDir 为目录名称
  // 不传的话，会使用随机值
  dispatchDir?: string;

  // 禁止移动的名单列表
  blackList?: Array<string | RegExp>;
};
```

## 原理

[Vite 版本的组件分发插件](https://juejin.cn/post/7439938405918244891)


## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-export-default-in-vue
Description: 在 Vue 中增加默认导出
Author: novlan1
Latest version: 1.0.0

# 增加默认导出

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-export-default-in-vue">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-export-default-in-vue">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-export-default-in-vue">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-export-default-in-vue">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>


在 Vue 中增加默认导出。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-export-default-in-vue -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { exportDefaultInVueVitePlugin } from '@plugin-light/vite-plugin-export-default-in-vue';


export default defineConfig({
  plugins: [
    exportDefaultInVueVitePlugin()
  ],
});
```

更推荐在脚本中前置执行，如：

```ts
const { exportDefaultInVue } = require('@plugin-light/vite-plugin-export-default-in-vue');

exportDefaultInVue({ root: process.cwd() });
```

## 原理

修改 `node_modules/vue/dist/vue.runtime.esm-bundler.js`，增加 `export default function(){};`。

## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-fix-uni-dir
Description: 修复打包路径异常
Author: novlan1
Latest version: 1.0.0

# 修复打包路径异常

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-fix-uni-dir">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-fix-uni-dir">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-fix-uni-dir">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-fix-uni-dir">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

monorepo 仓库下修复打包路径错误的问题。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-fix-uni-dir -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { fixUniDirVitePlugin } from '@plugin-light/vite-plugin-fix-uni-dir';


export default defineConfig({
  plugins: [
    fixUniDirVitePlugin()
  ],
});
```

## 原理

通过修改 `input.build.rollupOptions.output.chunkFileNames` ，去掉 `..`。

```ts
config: (input) => {
  const originChunkFileNames = input.build.rollupOptions.output.chunkFileNames;

  function chunkFileNames(...args: any) {
    let result = originChunkFileNames(...args);
    result = result.replace(/\.\.-/g, '');
    return result;
  }

  input.build.rollupOptions.output.chunkFileNames = chunkFileNames;
  return input;
},
```

相关问题

- https://ask.dcloud.net.cn/question/152306
- https://github.com/dcloudio/uni-app/issues/3049

## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-free-pages
Description: 不使用 guru 时，动态拆分 pages.json
Author: novlan1
Latest version: 1.0.0

# 自由模式动态拆分路由

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-free-pages">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-free-pages">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-free-pages">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-free-pages">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

        
不使用 `guru` 时，动态拆分 `pages.json`。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-free-pages -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { freePagesVitePlugin } from '@plugin-light/vite-plugin-free-pages';


export default defineConfig({
  plugins: [
    freePagesVitePlugin({
      inputDir: process.env.UNI_INPUT_DIR,
    })
  ],
});
```



## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-gen-mp-qq-app-id
Description: 修复 uni-app 中 QQ小程序打包后 appId 错误问题
Author: novlan1
Latest version: 1.0.0

# 修复QQ小程序 appId 错误

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-gen-mp-qq-app-id">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-gen-mp-qq-app-id">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-gen-mp-qq-app-id">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-gen-mp-qq-app-id">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>


修复 `uni-app` 中 QQ小程序打包后 `appId` 错误问题。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-gen-mp-qq-app-id -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { genMpQQAppIdVitePlugin } from '@plugin-light/vite-plugin-gen-mp-qq-app-id';


export default defineConfig({
  plugins: [
    genVersionWebVitePlugin(),
  ],
});
```

## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-gen-version
Description: 输出当前版本，包括构建信息、最后一次提交信息
Author: novlan1
Latest version: 1.0.2-beta.0

# 版本输出

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-gen-version">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-gen-version">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-gen-version">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-gen-version">
  <img src="https://img.shields.io/badge/TypeScript-strict-blue?logo=typescript&logoColor=white" alt="TypeScript strict">
  <img src="https://img.shields.io/badge/created-2022--01-blue?logo=github&logoColor=white">
</p>

输出当前版本，包括构建信息、最后一次提交信息。

可参考对应的 [webpack plugin](./webpack-plugin-gen-version.html)。

## 1. 作者

**novlan1**

## 2. 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-gen-version -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { 
  genVersionMpVitePlugin,
  genVersionWebVitePlugin,
 } from '@plugin-light/vite-plugin-gen-version';
import { BUILD_NAME_MAP } from 't-comm/lib/v-console/config';


const diffPlugins = [];
if (process.env.UNI_PLATFORM !== 'h5') {
  diffPlugins.push(genVersionMpVitePlugin());
} else {
  diffPlugins.push(genVersionWebVitePlugin({
    buildName: BUILD_NAME_MAP.build,
    commitName: BUILD_NAME_MAP.commit,
    delay: 0,
  }));
}


export default defineConfig({
  plugins: [
    ...diffPlugins,
  ],
});
```

## 3. 参数

```ts
export type IGenVersionOptions = {
  // 传入 buildName 时，会将构建信息插入到 buildName 中
  buildName?: string;

  // 传入 commitName 时，会将最后一次提交信息插入到 commitName 中
  commitName?: string;

  // 延迟打印时间，单位 ms，默认 10
  delay?: number;
};
```

## 4. 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-global-this-polyfill
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-global-this-polyfill">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-global-this-polyfill">   <img src="https://img.shields.io/npm/v/@p
Author: novlan1
Latest version: 1.0.0

# GlobalThis 垫片

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-global-this-polyfill">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-global-this-polyfill">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-global-this-polyfill">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-global-this-polyfill">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>


对没有 `globalThis` 的环境进行 `polyfill`，比如 QQ 小程序。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-gen-mp-qq-app-id -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { globalThisPolyfillVitePlugin } from '@plugin-light/vite-plugin-gen-mp-qq-app-id';


export default defineConfig({
  plugins: [
    globalThisPolyfillVitePlugin(),
  ],
});
```

## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-guru-pages
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-guru-pages">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-guru-pages">   <img src="https://img.shields.io/npm/v/@plugin-light/vite-plu
Author: novlan1
Latest version: 1.0.0

# GURU模式动态拆分路由

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-guru-pages">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-guru-pages">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-guru-pages">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-guru-pages">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

        
使用 guru 时，动态拆分 pages.json

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-guru-pages -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { guruPagesVitePlugin } from '@plugin-light/vite-plugin-guru-pages';


export default defineConfig({
  plugins: [
    guruPagesVitePlugin({
      guruNamespace,
      defaultGuruNamespace,
      guruList,
      inputDir: process.env.UNI_INPUT_DIR,

      mainPages: [
        {
          path: 'views/entrance/entrance',
          name: 'entrance',
          style: {
            navigationStyle: 'custom',
          },
        },
      ],
    })
  ],
});
```


## 参数

```ts
export interface IGuruPagesVitePluginOptions {
  // 当前命名空间
  guruNamespace: string

  // 项目入口路径
  inputDir: string;

  /**
   * 不同 root 对应的命名空间列表，如：
   * [
   *   {
   *     root: 'views/match',
   *     guruNamespace: 'convert-cross-one'
   *   },
   *   {
   *     root: 'views/sche-manage-vert',
   *     guruNamespace: 'convert-cross-two'
   *   },
   *   {
   *     root: 'views/match-list',
   *     guruNamespace: 'convert-cross-two'
   *   },
   *   {
   *     root: 'views/battle-room',
   *     guruNamespace: 'convert-cross-three'
   *   }，
   * ]
   */
  guruList: Array<{ root: string; guruNamespace: string }>;

  // 默认命名空间
  defaultGuruNamespace: string;

  // 主包页面，如果传入，则使用“增加模式”，即用传入的“mainPage”替换之前的主包页面
  // 如果不传入，则使用“删除模式”，即删除之前的主包页面，用第一个分包页面当成主包页面（删除模式用的是另一个插件）
  mainPages?: Record<string, any>;
}
```



## 更新日志

[点此查看](./CHANGELOG.md)
npm package: @plugin-light/vite-plugin-ifdef
Description: <p align="center">   <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-ifdef">   <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-ifdef">   <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-ifdef"
Author: novlan1
Latest version: 1.0.0

# 条件编译

<p align="center">
  <img src="https://img.shields.io/npm/dw/@plugin-light/vite-plugin-ifdef">
  <img src="https://img.shields.io/npm/unpacked-size/@plugin-light/vite-plugin-ifdef">
  <img src="https://img.shields.io/npm/v/@plugin-light/vite-plugin-ifdef">
  <img src="https://img.shields.io/npm/l/@plugin-light/vite-plugin-ifdef">
  <img src="https://img.shields.io/github/last-commit/novlan1/plugin-light">
  <img src="https://img.shields.io/github/created-at/novlan1/plugin-light">
</p>

实现了 `uni-app` 中的条件编译功能。

可参考对应的 [webpack loader](./webpack-loader-ifdef.html)。

## 如何使用

安装

```bash
pnpm add @plugin-light/vite-plugin-ifdef -D
```

在 `vite.config.ts` 中添加如下设置：


```ts
import { defineConfig } from 'vite';
import { ifdefVitePlugin } from '@plugin-light/vite-plugin-ifdef';


export default defineConfig({
  plugins: [
    ifdefVitePlugin({
      context: { H5: true, VUE3: true },
      type: ['css', 'js', 'html'],
    })
  ],
});
```

## 参数

同对应的 [webpack loader](./webpack-loader-ifdef.html)。

## 更新日志

[点此查看](./CHANGELOG.md)