Manus

发表于 2025/05/24 更新于 2025/05/25

作者 puppylpg 30 分钟阅读

碰瓷deepseek的manus，在刚出来的时候显得恶臭味儿十足，被大家一通口诛笔伐。最近听同事又提及manus，才重新想起这个已经归于平静的产品。毕竟也是个不错的东西，散掉了恶臭味儿，到底有多方便，还是值得体验一下的。

确实不错。

使用体验
1. 惊艳初见
2. 终于活成了讨厌的样子
前路漫漫

使用体验

https://manus.im/share/MObeRfsZ8USgS63VM0bQZA?replay=1
https://manus.im/share/IbOAd9okzPcuaxQhUJwwvM?replay=1

给manus提了个需求：制作一个静态网站，能够轮播图片和音乐

我有一个文件夹，里面有上百张照片，怎么把他们做成一个网站，可以配上bgm做照片轮播

惊艳初见

manus没有急着开干，而是先分析了一下需求，发现我提的太笼统，所以进一步发出了追问：

感谢您的需求！我将帮您创建一个带有背景音乐和照片轮播功能的网站。为了更好地为您服务，我需要了解一些细节：
您的照片文件夹位于哪里？请提供具体路径或告诉我如何访问这些照片。
您希望网站的风格是怎样的？例如简约、现代、复古等。
您已经有想用的背景音乐了吗？如果有，请告诉我音乐文件的位置；如果没有，我可以帮您寻找合适的背景音乐。
您对照片轮播的效果有特别的要求吗？例如轮播速度、转场效果等。
了解这些信息后，我将为您创建一个美观且功能完善的照片轮播网站。

这是一个好习惯，毕竟面对不专业的产品经理，追问清楚细节是非常重要的。从这一点看，manus还是有点儿专业的。当然，作为一个不专业的产品经理，我也不想要太多细节，让manus自己发挥就行：

你先mock一些照片和bgm吧，我等你做好后会自己做个替换

拿到相对靠谱点儿的需求后，manus正式开干——mkdir + todo文件：

  
ubuntu@sandbox:~ $ cd /home/ubuntu && mkdir -p photo_slideshow_project && cd photo_slideshow_project && echo "创建todo.md文件"
创建todo.md文件
ubuntu@sandbox:~/photo_slideshow_project $

mkdir有点儿绷不住，让人不禁想起那个有名的梗——R星：GTA6在做了在做了（指GTA6的文件夹已创建）。不过创建todo文件确实是个好习惯，防止后面上下文太长了，忘了要做什么。这和平时做开发也类似，上来先搞一个设计文档，或者至少简单写一下实现步骤。毕竟人也有很多事儿要做，“上下文太长”也会忘记一些事情。从这一点来看，llm和人还真是相似啊。

创建React静态网站模板：

  
ubuntu@sandbox:~ $ cd /home/ubuntu && cd /home/ubuntu && create_react_app photo_slideshow_project
Starting setup... (this might take a while)
Created new React app photo_slideshow_project at /home/ubuntu/photo_slideshow_project
Updated app title to photo_slideshow_project
Installing dependencies...
Initializing git repository...
Important commands to run in the shell:
To start the dev server, run 'pnpm run dev' from the project root This will restart on file-save, so you can leave this running in a dedicated shell and alternate between making changes using edit_file and testing them in your browser without needing to re-start the dev server.
The project root is /home/ubuntu/photo_slideshow_project
=== Project Structure ===
├── public/
├── src/
│   ├── assets/       # Static assets like images
│   ├── components/
│   │   └── ui/       # UI components from shadcn/ui
│   ├── hooks/        # Custom React hooks
│   ├── lib/          # Utility functions and libraries
│   ├── App.css       # App-specific styles
│   ├── App.tsx       # Main App component
│   ├── index.css     # Global styles
│   ├── main.tsx      # Entry point
│   └── vite-env.d.ts # TypeScript declarations
├── components.json   # shadcn/ui configuration
├── eslint.config.js  # ESLint configuration
├── index.html        # HTML entry point
├── package.json      # Project dependencies and scripts
├── pnpm-lock.yaml    # Lock file for dependencies
├── postcss.config.js # PostCSS configuration
├── tailwind.config.js # Tailwind CSS configuration
├── tsconfig.app.json # TypeScript configuration for app
├── tsconfig.json     # Main TypeScript configuration
├── tsconfig.node.json # TypeScript configuration for Node
└── vite.config.ts    # Vite bundler configuration
IMPORTANT NOTE: This project is built with TypeScript(tsx).
ubuntu@sandbox:~ $

接下来就稍微有点儿惊艳了，manus使用curl自己去下载了一批音频和图片：

  
ubuntu@sandbox:~ $ cd /home/ubuntu/photo_slideshow_project && cd /home/ubuntu/photo_slideshow_project && curl -o src/assets/audio/background_music.mp3 https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100 8735k  100 8735k    0     0  7306k      0  0:00:01  0:00:01 --:--:-- 7310k

ubuntu@sandbox:~/photo_slideshow_project $ cd /home/ubuntu/photo_slideshow_project && cd /home/ubuntu/photo_slideshow_project && for i in {1..10}; do curl -o "src/assets/images/photo${i}.jpg" "https://picsum.photos/800/600?random=${i}"; sleep 1; done
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
  0     0    0     0    0     0      0      0 --:--:-- --:--:-- --:--:--     0
ubuntu@sandbox:~/photo_slideshow_project $

还得是大模型，又认识了两个奇奇怪怪的网站！

同时manus在todo里更新了任务进度：

  
# 照片轮播网站制作计划

## 需求确认
- [x] 确认用户需要带有背景音乐的照片轮播网站
- [x] 确认使用模拟照片和背景音乐进行开发

## 网站开发
- [x] 创建React静态网站模板
- [x] 下载模拟照片素材
- [x] 下载模拟背景音乐素材
- [x] 将照片和音乐导入项目
- [ ] 实现照片轮播功能
- [ ] 实现背景音乐播放功能
- [ ] 添加用户控制界面（播放/暂停/切换等）
- [ ] 优化网站响应式设计（适配不同设备）

## 测试与优化
- [ ] 测试网站在本地环境的运行情况
- [ ] 优化照片加载性能
- [ ] 优化网站界面美观度
- [ ] 确保音乐和轮播功能正常工作

## 部署与交付
- [ ] 准备网站部署
- [ ] 部署网站并获取访问链接
- [ ] 向用户提供完整的网站代码和使用说明
- [ ] 说明如何替换照片和背景音乐

然后让我有点儿惊讶的来了，manus还能注意到下载的图片有问题：

我注意到模拟照片下载失败了，所有图片文件都是0字节。我将重新下载照片素材，确保它们能正常显示在轮播中。请稍等片刻。

所以它又重新下载了一轮。看看，人家不光做任务，还会注意效果！这件事情并不单，但是每做一个阶段就检查一下效果，这种深入骨髓的意识，太讨喜了。反思一下自己经常给老板交一个有问题的结论（做完了 == 完成了），然后被反问到一言不发，惭愧惭愧。

前置阶段就绪，manus正式开始写代码。llm写代码的速度太快了，堪比温酒斩华雄，一堆TypeScript和css代码瞬间就完成了。

接着好玩的来了，manus自己开始了验证环节！

先启动服务：

  
ubuntu@sandbox:~ $ cd /home/ubuntu/photo_slideshow_project && cd /home/ubuntu/photo_slideshow_project && pnpm run dev
> react_repo@0.0.0 dev /home/ubuntu/photo_slideshow_project
> vite

  VITE v6.3.5  ready in 245 ms
  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

然后它真的打开了一个本地chrome，并模拟用户点击行为：

正在本地浏览器中测试和优化网站功能：正在浏览 http://localhost:5173/

这一点确实是manus比较惊艳的地方。

接着manus准备交付项目了：

先写个README.md！这一条基本素养不知道秒杀了多少程序员！
然后打包为zip交付；

看看这readme，项目概述、如何部署、如何修改、项目结构，要是能有个这样的队友，真的看哭：

  
# 照片轮播网站使用说明

## 项目概述

这是一个基于React的照片轮播网站，具有以下功能：
- 自动轮播照片展示
- 背景音乐播放
- 用户控制界面（播放/暂停、上一张/下一张、音量控制等）
- 响应式设计，适配不同设备

## 如何替换照片

1. 将您的照片文件放入 `src/assets/images/` 目录中
2. 照片命名格式为 `photo1.jpg`, `photo2.jpg`, `photo3.jpg` 等
3. 支持的图片格式：JPG, JPEG, PNG, WebP
4. 建议使用相同尺寸的照片以获得最佳显示效果
5. 如需更改照片数量，请修改 `src/components/Slideshow.tsx` 文件中的 `importAllImages` 函数：


const importAllImages = () => {
  const images: string[] = [];
  // 修改这里的数字以匹配您的照片数量
  for (let i = 1; i <= 您的照片数量; i++) {
    images.push(`/src/assets/images/photo${i}.jpg`);
  }
  return images;
};


## 如何替换背景音乐

1. 将您的音乐文件放入 `src/assets/audio/` 目录中
2. 支持的音频格式：MP3, WAV, OGG
3. 在 `src/App.tsx` 文件中修改音乐路径：


<Slideshow 
  autoPlayInterval={5000} 
  musicSrc="/src/assets/audio/您的音乐文件名.mp3" 
    />


## 如何自定义轮播设置

在 `src/App.tsx` 文件中，您可以修改以下参数：


<Slideshow 
  // 轮播间隔时间（毫秒）
  autoPlayInterval={5000} 
  musicSrc="/src/assets/audio/background_music.mp3" 
    />


## 如何运行项目

1. 确保您已安装 Node.js 和 pnpm
2. 在项目根目录下运行以下命令安装依赖：

   pnpm install

3. 启动开发服务器：

   pnpm run dev

4. 在浏览器中访问 `http://localhost:5173/`

## 如何构建生产版本

1. 在项目根目录下运行以下命令：

   pnpm run build

2. 构建完成后，生产文件将位于 `dist` 目录中
3. 您可以将 `dist` 目录中的文件部署到任何静态网站托管服务

## 项目结构


photo_slideshow_project/
├── public/                # 公共资源
├── src/                   # 源代码
│   ├── assets/            # 静态资源
│   │   ├── images/        # 照片文件
│   │   └── audio/         # 音频文件
│   ├── components/        # 组件
│   │   └── Slideshow.tsx  # 轮播组件
│   ├── styles/            # 样式文件
│   │   └── Slideshow.css  # 轮播组件样式
│   ├── App.css            # 应用样式
│   ├── App.tsx            # 主应用组件
│   ├── index.css          # 全局样式
│   └── main.tsx           # 入口文件
└── ... 其他配置文件


## 技术栈

- React
- TypeScript
- Vite
- CSS3

## 注意事项

- 由于浏览器安全策略，背景音乐可能需要用户交互后才能自动播放
- 为获得最佳体验，建议使用现代浏览器（Chrome, Firefox, Safari, Edge等）
- 如需添加更多功能或自定义样式，请参考相应组件文件

这一刻，我已经笃定未来的ai编程要比人靠谱了！因为它是真的会认真走流程！人的话，不确定因素太多了！

最后的交付是个zip包：

ubuntu@sandbox:~ $ cd /home/ubuntu && cd /home/ubuntu && mkdir -p photo_slideshow_package && cp -r photo_slideshow_project/* photo_slideshow_package/ && cd photo_slideshow_package && rm -rf node_modules .git && cd .. && zip -r photo_slideshow_package.zip photo_slideshow_package
[previous content truncated]...ion.tsx (deflated 67%)
  adding: photo_slideshow_package/src/components/ui/alert-dialog.tsx (deflated 77%)
  adding: photo_slideshow_package/src/components/ui/alert.tsx (deflated 63%)
  adding: photo_slideshow_package/src/components/ui/aspect-ratio.tsx (deflated 34%)
  adding: photo_slideshow_package/src/components/ui/avatar.tsx (deflated 70%)
  adding: photo_slideshow_package/src/components/ui/badge.tsx (deflated 59%)
  adding: photo_slideshow_package/src/components/ui/breadcrumb.tsx (deflated 68%)
  adding: photo_slideshow_package/src/components/ui/button.tsx (deflated 62%)
  adding: photo_slideshow_package/src/components/ui/calendar.tsx (deflated 68%)
  adding: photo_slideshow_package/src/components/ui/card.tsx (deflated 75%)
  adding: photo_slideshow_package/src/components/ui/carousel.tsx (deflated 73%)
  adding: photo_slideshow_package/src/components/ui/chart.tsx (deflated 73%)
  adding: photo_slideshow_package/src/components/ui/checkbox.tsx (deflated 58%)
  adding: photo_slideshow_package/src/components/ui/collapsible.tsx (deflated 60%)
  adding: photo_slideshow_package/src/components/ui/command.tsx (deflated 76%)
  adding: photo_slideshow_package/src/components/ui/context-menu.tsx (deflated 82%)
  adding: photo_slideshow_package/src/components/ui/dialog.tsx (deflated 72%)
  adding: photo_slideshow_package/src/components/ui/drawer.tsx (deflated 73%)
  adding: photo_slideshow_package/src/components/ui/dropdown-menu.tsx (deflated 81%)
  adding: photo_slideshow_package/src/components/ui/form.tsx (deflated 73%)
  adding: photo_slideshow_package/src/components/ui/hover-card.tsx (deflated 59%)
  adding: photo_slideshow_package/src/components/ui/input-otp.tsx (deflated 65%)
  adding: photo_slideshow_package/src/components/ui/input.tsx (deflated 49%)
  adding: photo_slideshow_package/src/components/ui/label.tsx (deflated 50%)
  adding: photo_slideshow_package/src/components/ui/menubar.tsx (deflated 82%)
  adding: photo_slideshow_package/src/components/ui/navigation-menu.tsx (deflated 76%)
  adding: photo_slideshow_package/src/components/ui/pagination.tsx (deflated 70%)
  adding: photo_slideshow_package/src/components/ui/popover.tsx (deflated 60%)
  adding: photo_slideshow_package/src/components/ui/progress.tsx (deflated 51%)
  adding: photo_slideshow_package/src/components/ui/radio-group.tsx (deflated 65%)
  adding: photo_slideshow_package/src/components/ui/resizable.tsx (deflated 67%)
  adding: photo_slideshow_package/src/components/ui/scroll-area.tsx (deflated 67%)
  adding: photo_slideshow_package/src/components/ui/select.tsx (deflated 76%)
  adding: photo_slideshow_package/src/components/ui/separator.tsx (deflated 53%)
  adding: photo_slideshow_package/src/components/ui/sheet.tsx (deflated 72%)
  adding: photo_slideshow_package/src/components/ui/sidebar.tsx (deflated 79%)
  adding: photo_slideshow_package/src/components/ui/skeleton.tsx (deflated 28%)
  adding: photo_slideshow_package/src/components/ui/slider.tsx (deflated 56%)
  adding: photo_slideshow_package/src/components/ui/sonner.tsx (deflated 65%)
  adding: photo_slideshow_package/src/components/ui/switch.tsx (deflated 59%)
  adding: photo_slideshow_package/src/components/ui/table.tsx (deflated 76%)
  adding: photo_slideshow_package/src/components/ui/tabs.tsx (deflated 72%)
  adding: photo_slideshow_package/src/components/ui/textarea.tsx (deflated 44%)
  adding: photo_slideshow_package/src/components/ui/toast.tsx (deflated 74%)
  adding: photo_slideshow_package/src/components/ui/toaster.tsx (deflated 59%)
  adding: photo_slideshow_package/src/components/ui/toggle-group.tsx (deflated 68%)
  adding: photo_slideshow_package/src/components/ui/toggle.tsx (deflated 60%)
  adding: photo_slideshow_package/src/components/ui/tooltip.tsx (deflated 60%)
  adding: photo_slideshow_package/src/components/Slideshow.tsx (deflated 64%)
  adding: photo_slideshow_package/src/hooks/ (stored 0%)
  adding: photo_slideshow_package/src/hooks/use-mobile.tsx (deflated 48%)
  adding: photo_slideshow_package/src/hooks/use-toast.ts (deflated 66%)
  adding: photo_slideshow_package/src/lib/ (stored 0%)
  adding: photo_slideshow_package/src/lib/utils.ts (deflated 27%)
  adding: photo_slideshow_package/src/styles/ (stored 0%)
  adding: photo_slideshow_package/src/styles/Slideshow.css (deflated 75%)
  adding: photo_slideshow_package/src/App.css (deflated 49%)
  adding: photo_slideshow_package/src/App.tsx (deflated 33%)
  adding: photo_slideshow_package/src/index.css (deflated 67%)
  adding: photo_slideshow_package/src/main.tsx (deflated 36%)
  adding: photo_slideshow_package/src/vite-env.d.ts (stored 0%)
  adding: photo_slideshow_package/tailwind.config.js (deflated 64%)
  adding: photo_slideshow_package/todo.md (deflated 47%)
  adding: photo_slideshow_package/tsconfig.app.json (deflated 48%)
  adding: photo_slideshow_package/tsconfig.json (deflated 43%)
  adding: photo_slideshow_package/tsconfig.node.json (deflated 47%)
  adding: photo_slideshow_package/vite.config.ts (deflated 35%)
ubuntu@sandbox:~ $

这也是我觉得manus能改进的地方：如果manus内部自己搭个gitlab，代码项目直接交付gitlab地址，后续的修改操作全都在该项目上commit，那用户体验将大增。如果能支持用户也修改代码，manus在用户修改后的基础上基于最新的master做代码commit，那将是绝杀！

至于zip包交付，只能说太外包性质了。难道当前对manus的定位还只是个外包？

整体来说，第一版的网站做的还是很惊艳的，毕竟只需要十几分钟就有一个可执行的代码了，展示出来还挺漂亮。

终于活成了讨厌的样子

网站完成了，我觉得还是可以给到90分的。虽然一开始我也说了manus可以随便发挥，但产品经理的鬼话哪有靠谱的。于是我又针对一些点开始锐评起来：

有下面几处我想修改一下：
background music要支持多首轮播，到时候我会放很多mp3文件，你把他们导入一个个播放就行。文件名称里可能有空格；
我会放很多照片，读取照片的时候，要轮播所有的照片，他们可能有多种类型，jpe/jpeg，最好支持heic格式；
进入网站之后，要先输入密码才能进入并自动轮播，密码是xxxxxxxx，注意不要让别人通过看网页源码猜出来密码

manus拿到需求就开始闷头改，很快就交付了一版带密码保护的版本，效率太高了！但是接下来我就发现密码不对，根本进不去：

你确定你设置的密码是xxxxxxxx？我用这个密码根本进不去

果然，开始不省心了起来，只要有代码，就会有bug。

修完bug，我又开始了指指点点：

你的照片加载和音频加载还是有问题。我要加载images文件夹下任意命名的图片，而不是按照你的标准来限定图片个数和图片名称。音频也是

做的不错，我还有几个想优化的点：
照片只需要有播放按钮，上一个下一个按钮就行了，不需要上面标记照片的小圆点，照片太多的时候小圆点就太多了；
暂停照片的时候不要暂停音乐，播放照片的时候也不用重置音乐播放进度；

你能否再优化一版：文件名以IMG开头的照片，比如IMG_20230916_232037.jpeg，其中20230916是照片的拍摄日期。你能不能在播放照片的时候在上方显示一个漂亮的时间轴，对于这种能解析出日期的照片，在播放的时候标记出时间轴的相应位置。当然不是所有的照片名称都是这种格式，对于这种照片就不用显示时间轴了。

时间轴有点儿丑的……不需要每一个照片都要在时间轴上有一个节点，播放到那个照片的时候把这个节点和它对应的日期显示出来就行了，然后这个节点就可以消失了。另外节点和时间轴都可以是半透明的，美观一些

突然意识到我终于活成了自己讨厌的样子，成了不断指指点点的产品经理，没有prd，全靠口嗨，最终让rd改了一版又一般，不断返工。虽然面对的是manus，但是想到这里，还是感觉有点儿惭愧。更恐怖的是，对ai产品的使用，会不会助长pd这种不专业的习惯？如果真把这种习惯带到工作里，那程序员可真要麻了。

虽然不停下发需求很爽，但其实也挺折腾的：

不停返工其实是很麻烦的，即便是效率很高的ai，返工一次也得十几分钟，自己再验收一轮，可能半小时，还是不满意；
我自己对前端是一窍不通的，面对已经能运行的初版，我想做些小改动依旧束手无策，只能让ai不断返工，让自己也疲于奔命。所以ai只是降低了入局的门槛，但无法完全抹平这些门槛。真正能把ai在某个职业应用自如的，还得是本职业的专业人员。外行+ai依然不能自如的胜任一项内行工作；
对于内行来说，掌握本行业技能需要付出的努力变低了，所以更应该善用这些ai工具；

值得一提的是manus交付的这么多版zip的命名，仿佛看到了大学生交作业时候的版本命名法：

photo_slideshow_package.zip
photo_slideshow_package_updated.zip // 不用v2，感觉要出事儿
photo_slideshow_package_final.zip // 你真的觉得这会是final吗？
photo_slideshow_package_optimized.zip
photo_slideshow_package_timeline.zip
photo_slideshow_package_beautiful_timeline.zip
photo_slideshow_final_package.zip // 解释解释，final package和package final的区别在哪儿？
photo_slideshow_fixed_package.zip

除了看到一个已经快疯了的程序员，还看到了一个已经疯了的命名方式：去他x的，就这么发布吧

前路漫漫

最终，我对manus的评价是：着实让我惊艳了一把，但还是没能完全达到我的期待。

需求总是越提越高阶的。本地跑的还是很满意的，但是真的部署到服务器上，因为网站资源太大（1.5G），又部署在海外服务器上，下载资源太慢，体验完全比不上本地。所以我又提了一些让manus做性能优化的任务：

很棒。现在我遇到了一些网络性能的问题，想优化一下：
图片和视频能边展示边预加载吗？比如一开始先加载第一首音乐和前几张图片，如果快展示完了，就预加载后面的。如果在一开始就请求所有的素材，网速不好的情况下，会出问题。

有几个bug：
密码验证页面进不去
在build之后，dist里的图片名称会从IMG_20140503_131242.jpg变成IMG_20140503_131242-Cd4NXAWn.jpg，我不知道为什么会变成这样，但是它会导致你从filename提取日期的正则失效；
asserts下的图片和音乐在dev的时候是可用的，但是build之后就不可用了；
你改改吧，这次好好验证，不要再出bug了。而且建议你使用npx http-server dist验证一下build后的静态网页是否可用。

很遗憾，它并没有完成的很好。而这么来来回回折腾下去，我也终于累了……靠人不如靠自己……

最终我干脆用ffmpeg，给照片做了尺寸压缩（0.9x0.9）：

  
$ for file in *.jpg *.jpeg *.png;
ffmpeg -i "$file" -vf "scale=iw*0.9:ih*0.9" "compressed_images/${file%.*}.${file##*.}"

最终资源缩小为了200M，好了很多，但这个问题依旧没解决。

所以，ai固然还要继续进步，但是最终干专业的事还是需要专业的人，光靠一个拥有ai加持的门外汉还是不够的。至少现阶段的ai还是这样的。其实这也是我理想中ai的样子：大幅降低人的工作成本，但又不能完全取代人。毕竟如果真的有一天，ai能完美完成了一切，那可能真的就有人工智能危机了。

本文由作者按照 CC BY 4.0 进行授权

使用体验

惊艳初见

终于活成了讨厌的样子

前路漫漫

热门标签