# seepfly

**Repository Path**: Rickest_Rick/seepfly

## Basic Information

- **Project Name**: seepfly
- **Description**: seepfly 是先胜云 v2 架构上的基础打包工具。在 rollup 的基础上内置了常用插件，并提供了更便捷的使用方式。
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2023-12-08
- **Last Updated**: 2023-12-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# seepfly

`seepfly` 是先胜云 `v2` 架构上的基础打包工具。在 `rollup` 的基础上内置了常用插件，并提供了更便捷的使用方式。

## 安装

```shell
pnpm i seepfly -D
```

## 使用

```shell
seepfly build
```

## 帮助

```shell
seepfly build -h

Usage:
  $ seepfly build [root]

Options:
  --base <base>            [string] 在开发或生产中使用时的基本公共路径
  --target <target>        [string] 打包目标类型 'element' | never
  --mode <mode>            [string] 设置环境模式
  --antPrefix <antPrefix>  [string] ant-design 样式前缀
  --sourcemap              [boolean] 用于构建的输出源映射 (default: false)
  --analyze                [boolean] 用于输出可视化分析 (default: false)
  -h, --help               Display this message
  -v, --version            Display version number
```

## 内置插件

`build` 模式

- @rollup/plugin-url
- @rollup/plugin-alias
- @rollup/plugin-replace
- @rollup/plugin-node-resolve
- @rollup/plugin-commonjs
- @rollup/plugin-babel
- @rollup/plugin-json
- rollup-plugin-copy
- rollup-plugin-postcss
- rollup-plugin-terser
- rollup-plugin-visualizer

## `seepfly` ❤️ `vite`

`seepfly` 默认使用 `vite.config.ts` 作为兼容配置，并提供了 `dev` 模式下常用的封装，使用 `defineViteConfig` API 定义 `vite` 配置

`defineViteConfig` 内置的 `vite` 插件

- @vitejs/plugin-react-refresh
- vite-plugin-seepln（提供常用的 vite 配置）
- vite-plugin-seepln-antd（支持 antd 样式动态引入）
- vite-plugin-seepln-icon（支持生成组件的图标引入方式）

## 升级到 seepfly

参考 `element-base` commit: 056c11d2f5a441cc949b1d7f93445cd17fd7a24e

- pnpm i seepfly -D
- 更新 `scripts` 中 "build": "seepfly build"
- 更新依赖 `@seepln/components >= 1.2.0`、`@seepln/materials >= 1.2.62`、`@seepln/theme >= 2.1.1`
- 移除当前项目中不必要的依赖

```shell
- "@babel/plugin-proposal-class-properties"
- "@babel/plugin-transform-runtime"
- "@babel/preset-env"
- "@babel/preset-react"
- "@babel/runtime"
- "@rollup/plugin-alias"
- "@rollup/plugin-babel"
- "@rollup/plugin-commonjs"
- "@rollup/plugin-json"
- "@rollup/plugin-node-resolve"
- "@rollup/plugin-replace"
- "@rollup/plugin-url"
- "@vitejs/plugin-legacy"
- "@vitejs/plugin-react-refresh"
- "babel-plugin-import"
- "less-plugin-import-node-modules"
- "postcss"
- "postcss-import"
- "rollup"
- "rollup-plugin-copy"
- "rollup-plugin-postcss"
- "rollup-plugin-svg"
- "rollup-plugin-terser"
- "rollup-plugin-typescript2"
- "rollup-plugin-visualizer"
- "vite-plugin-seepln"
- "vite-plugin-seepln-antd"
```

- 更新 `vite.config.ts` 如下

```ts
import { defineViteConfig } from 'seepfly';

export default defineViteConfig({
  seepfly: {
    target: 'element',
  },
  server: {
    // 各自配置代理保持不变
  },
});
```

- 使用代码迁移工具升级图标组件 `@seepln/codemod-icon`

```shell
# 全局安装

yarn global add @seepln/codemod-icon
seepln-codemod-icon src

# 使用 npx
npm_config_registry=http://106.15.190.172:4873 npx -p @seepln/codemod-icon seepln-codemod-icon src
```
- `tsconfig.json` 中更新 `"types": ["vite/client", "seepfly/client"]`,
- 手动升级工具无法处理的图标组件，并检查更改后的内容
- 替换 `less` 文件中的 `.anticon` 的样式 为 `.seepln-icon`