最近一直在思考对于大型复杂的前端项目 vue 是怎么去实践的，还是说非得换成技术栈为 React。找了很多资料后，发现 vuemastery 里面的有些课程也许会找到一些答案，比如组件的设计模式等等，于是买了一个月的会员。

但这个网站毕竟是用美元来支付的，一个月 10$ 左右对于我来说还是有点小贵。好在网站提供下载的选项，可以将所有课程都下载到本地，但是它用的字幕是在线的 cc 字幕，下载后的视频是没有字幕的。所以怎么解决字幕的问题是非常重要的。

下载 cc 字幕

一般这种资源在浏览器的调试器中都可以找到。在 Chrome 中 F12 -> Netwok -> clear清除所有网络请求后，开启 cc 字幕，这时候看到网络资源列表中会出现一个.vtt文件，就是我们需要的字幕了。

转换成 srt 格式

.vtt 格式的字幕很多播放器都不支持，我们需要将它转换成播放器可以支持的格式，比如：srt。搜索资料后发现vtt转srt并没有什么复杂的转换过程，就是把vtt文件的第一行 WEBVTT删掉，然后重命名为.srt即可。

这么多的字幕文件，我们一个个手动去做这种操作当然不行了，效率太低。我们使用命令行批量地去进行转换。

# 进入 .vtt 所在目录
cd ~/Documents/学习视频/vue 组件设计模式
# 批量重命名文件，将*.vtt 替换为.srt 
rename 's/\.vtt/.srt/' *.vtt
# 批量删除第一行，下面是 sed 语法 是 mac 操作系统的写法
sed -i '' -e '1d' *.srt