前段时间舔狗日记很火，就想着弄一个舔狗日记的网站，顺便学学VUE，一直说学，一直拖着
还没动手写代码，就注册了几个域名 dogart.cn / tiangou.men / dogart.me
非主流域名.me后缀还是我最喜欢的，最后还是保留了dogart.me

最近工作很闲，就开始摸索着开始写代码
还挺喜欢vue的第三方组件库elementui，于是开始看element的文档

第一次踩坑

由于不会npm，也没用过其他方式创建项目，所以我用了cdn引入的方式开始写，element的组件使用也挺简单，文档也写的很详细，一开始很快上手。
但是，当我想做单应用网页的时候，问题就出现了，vue-router在cnd引入的方式下，使用方式和文档中还有网上搜到的资料完全不一样，甚至晚上一度折腾到两三点还是不行。
第二天跟之前加的一位朋友聊到这件事，他向我推荐了vue的脚手架工具vue-cli，这下想偷懒都不行了，该学的还是要学。

npm踩坑

使用vue-cli，首先要安装npm，由于之前完全没接触过nodejs，所以就跟着网上教程一步一步走
npm安装教程：https://www.runoob.com/nodejs/nodejs-install-setup.html
安装完npm后，切换npm的缓存和下载地址，我自己不喜欢东西放在C盘

npm config set cache "D:\npm\npm-cache"
npm config set prefix "D:\npm\npm_global"

一切顺利，开始安装vue-cli，这里又出现了一个问题，vue-cli安装几次失败，搜了一下，切换成阿里的npm镜像：

npm config set registry http://registry.npm.taobao.org/

这下安装成功了，然后cmd启动vue-cli的图形化介面，cmd输入：vue ui
提示vue不是系统指令....群里问了下，又去搜了下，发现修改缓存和下载地址后，要手动把新的下载地址放在系统变量里面去..
把"D:\npm\npm_global"添加好系统变量后，cmd 输入 vue ui ，终于启动成功

使用vue加element创建项目

由于想少走点弯路，于是在B站上看了使用vue-cli创建项目的教程，这个教程真的通俗易懂，感兴趣又想学vue的朋友可以去看看
教程地址：https://www.bilibili.com/video/BV1CJ411j7CC?p=3
后面就跟着这个教程实践了一下，然后自己重开项目搞了个 舔狗的艺术 网站
本来打算自己用tp6.0写后台的，但自己这效率....最后还是先用了网上的api
网址：https://dogart.me
前端开源：https://github.com/Dieinwarm/dogartvue

最后修改：2021 年 01 月 27 日
© 允许规范转载
請我飲咖啡