# file-upload-app

**Repository Path**: fe521/file-upload-app

## Basic Information

- **Project Name**: file-upload-app
- **Description**: 文件上传管理后台
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2023-06-20
- **Last Updated**: 2023-06-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Vue3 文件上传管理后台

在线预览文档 https://docs.ffffee.com/project/file-upload/5-intro.html

## 一、如何购买课程

手机抖音搜 <b>李钟意讲前端</b> - 点击名称 - 进入店铺 - 在我的抖音店铺购买

https://www.douyin.com/search/李钟意讲前端

## 二、如何学习课程

PC 端

1. 学浪官网下载 APP https://www.xuelangapp.com/download
2. 使用购买课程的抖音号扫码登录

手机：

1. 下载学浪 APP
2. 使用购买课程的抖音号登录学浪即可看到课程

## 三、获取源码

更新代码将会被推送到码云 - 视频中的源码都可以在下面地址找到

https://gitee.com/fe521/file-upload-app

## 四、Figma 设计稿

https://www.figma.com/file/K6Kx0px4lLFVp5qhPwxXyG/electron-ffmpeg-video-to-gif

## 五、接口文档地址

https://documenter.getpostman.com/view/12310217/2s93z5AkZW

## 六、项目模板 - 从 0 到 1 搭建一个脚手架

Vue3 + Vite + TS + ElementPlus

模板地址 https://github.com/xieerduos/vue-vite-element-plus-starter

在线文档 [https://xieerduos.github.io/vue-vite-element-plus-starter](https://xieerduos.github.io/vue-vite-element-plus-starter)

## 七、启动项目

安装依赖

```bash
# npm install --registry=https://registry.npm.taobao.org
npm install
```

开发环境

```bash
npm run dev
```

## 八、打包项目

联调环境

```bash
npm run rd
```

测试环境

```bash
npm run qa
```

生产环境

```bash
npm run prod
```

## 九、ESlint 修复代码

执行下面命令，将会自动修复代码

```bash
npm run lint
```

## 十、生成 changelog

生成 `/CHANGELOG.md`

```bash
npm run changelog
```

生成 `/docs/CHANGELOG.md`

```bash
npm run changelog-docs
```

## 十一、构建部署

```bash
docker-compose build
docker-compose up -d
```

http://localhost:8000

## 十二、推荐的 IDE 设置

推荐使用[VSCode](https://code.visualstudio.com/)，再安装[Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar)插件（同时记得禁用 Vetur），还要加上[TypeScript Vue 插件（Volar）](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin)。

## 十三、TS 中对 `.vue` 导入的类型支持

默认情况下，TypeScript 无法处理 `.vue` 导入的类型信息，因此我们用 `vue-tsc` 替换 `tsc` CLI 进行类型检查。在编辑器中，我们需要[TypeScript Vue 插件（Volar）](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin)让 TypeScript 语言服务识别 `.vue` 类型。

如果你觉得单独的 TypeScript 插件反应不够快，Volar 还实现了一个更高效的[接管模式](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669)。你可以按照以下步骤启用它：

1. 禁用内置的 TypeScript 扩展
   1. 从 VSCode 的命令面板运行`Extensions: Show Built-in Extensions`
   2. 找到`TypeScript and JavaScript Language Features`，右键并选择`Disable (Workspace)`
2. 通过从命令面板运行`Developer: Reload Window`来重载 VSCode 窗口。