0x00

又到了搞事情的时间了。

在V2上看到一个人在看到另外一个人拿React搞了个网页版的Ubuntu后拿Vue搞了个网页版的Deepin后我又拿Vue搞了个网页版的Windows。

0x01

之前听说Evan You为Vue 3搞了个叫做Vite的东西，于是抱着试试看的心态尝试了一个疗程，发现这东西是有备而来啊，修改文件内容浏览器秒更新，很快啊！

之前还听说有个叫做Tailwind CSS的东西，于是也抱着试试看的心态尝试了一个疗程，发现这东西也是有备而来啊，设计布局全是class，很快啊！

之前还听说，额，不是，还学过TypeScript，强类型写代码，很快啊！

0x02

Vue 3跟2整体上没有太大的变化，还是熟悉的配方和熟悉的味道。这次为了同步多个组件的状态，加了Vuex这一味药。Vite也确实只服用了一个疗程，只用来搭建项目、调试和构建了。

Tailwind用来在没有专业UI/UX的情况下搞搞小的项目，或者为了快速出效果，真的是很香，但会把模板搞的花luan里qi胡ba哨zao的，结合着@apply用可能会更香一点。

虽说以前专门学过TypeScript，但真正写起来的时候还是有些力不从心，在组件里使用尤甚，出现很多让人摸不着头脑的错误其实都是语法的问题。

然而，整个开发过程中最麻烦也最耗时的却是图标的问题。Windows的图标很难拿得到，想做个伸手党结果百度谷歌了一圈几乎没有任何收获，找了个工具好歹导出了一部分原始图标，但是还差很多，没有办法，只能截图抠出来了，顺便拿小图标试了一把雪碧图（CSS Sprites）。字体图标开始用的Element Plus自带的icon，后来发现整套UI框架只用到了图标，何苦来哉，索性移除掉Element Plus，换单纯的图标库。一通猛如虎的操作后把Font Awesome引入了项目，结果发现免费的图标实在是辣眼睛，只能再换。找了个ionicons，看起来挺舒服的，效果也没有让我失望，666。

另外，为了能够在网页里打开PDF文件，还引入了pdf.js，也是个好东西。

大概就这么些子个吧。

3，2，1，上链接：我是链接