前言就在上周六，看到阿里云服务器举办的活动，共享虚拟主机6元一年。但是我以前用过，最痛苦的是它只给你开一个ftp，而且权限上有一些控制。所以我一直在想，开始玩到底好不好。想了想，6块钱也不多，就这样吧。嗯，大家注意了。你没看错，只需要几个小时，就可以把友达（Vue的作者）的博客带回家。还有一些其他的方面，实现起来都很简单。说到高仿，恐怕就变砖了会不好，现在看病挺贵的？先放友达的博客EvanYou，然后把假链接放BIGTIGER.ME，然后是项目地址博客声明本文只是提供一个想法跟大家交流，在实践的过程中有些地方可能不是最好的，不要拍砖，我是第一次写文章，如果大家有更好的解决方案或者实用的想法可以分享跟我来，期待~联系方式：liujinyang@bigtiger.me我们想用Markdown来编辑博客内容，不需要后台提供接口，没有数据库，使用Vue全家桶（你复制别人的博客，而且不使用别人的东西有点过分）使用NPM脚本一键发布博客。实践过程是买一台服务器，放一个地址共享虚拟主机普惠版，选择Linux，其他略过。最后使用FTP连接服务器，因为已经有人知道怎么操作了，详细描述比较麻烦。但是为了让大家快速搭建，我选择放在后面，有点像附录？。服务器上的目录结构最后，我们需要把你的博客文件放在htdocs目录下。使用vue-cli快速搭建目录结构。在进行后续操作之前，你必须确保你的电脑已经安装了node(>=4.x,6.x)$npminstall-gvue-cli$vueinitwebpackwriteyourhereProjectname$cdWriteyourprojectnamehere$npmi然后下面有几项可以配置。我就不详细介绍了。将Markdown文件转换为json。不想听的可以直接看这部分的源码，/build/create-posts-json.js这里用到了两个第三方库，第一个是markdown-to-json，第二个是markdown-js。大致思路是在/build/posts目录下写.md文件，然后通过markdown-to-json构建json文章列表，然后单独构建单个文件的json，将其中的内容进行转换使用markdown.toHTML将json转HTML，最后将生成的json文件放在/build/static/posts目录下。这里需要说明的是，markdown-to-json需要在文件中添加相应的信息构建列表并转成json，然后将这个js文件导入到/build/build.js和/build/dev-服务器分别。js，把它放在最上面。使用Vue全家桶老办法开发页面，老办法放源码/build/src。大致思路是用vue-router管理页面路由，vue-resource请求静态资源中对应的json文件，vuex切换页面。Loading...打包部署$npmrunbuild等待打包完成，使用FTP将/build/dist文件夹下的文件丢到服务器。这时候输入你的域名就可以看到你的博客了。你认为这是结束了吗？答案是不！细心的朋友会发现，这样的话，我不是每次发文章都要构建，然后手动上传到服务器吗？确实，这是非常不方便和高效的。那么接下来我们就来解决这个问题。嗯，和往常一样，先放源码吧。不喜欢听我嘟嘟嘟的可以去/build/release.js，里面用到了node的两个第三方库，分别是ftp和async。大致思路是使用node-ftp连接服务器，上传本地生成的json文件。但是当我们需要上传多个json文件时，就需要使用async来控制回调。然后引用我们之前写的create-posts-json.js，在package.json文件中的脚本中写上"release":"nodebuild/release.js"，就可以愉快的使用npmrunrelease来发布你的了一键文章。总结最后，我们实现了一个简单的博客系统。虽然时间很短，但是项目也很简单。但是我在实际开发中经历了一套完整的流程，从需求定制到产品完成。但毕竟实施时间有限，还有一些不足需要改进：Markdown处理不够彻底，比如代码展示等SEO优化，博客还是以内容为主。当Markdown文件没有被修改的时候，应该不需要重新上传，但是现在需要重新上传。loading切换生硬首页列表分页没做...懒得回复评论...懒得嵌入等等...最后谢谢大家听我哔...掌声？附录FTP连接服务器购买后会让你设置3个密码，分别是登录控制台的密码（当然阿里云的控制台也可以），数据库的密码（当然没用)，最后是FTP的密码！我连接的方式是使用FileZilla的客户端。Mac和Windows都有，好像是这样的，大家可以自己下载。然后我们需要找到我们需要使用的主机地址、用户名和密码。步骤如下：首先，登录阿里云控制台。找到产品和服务->域名和网站->云虚拟主机在面板中找到您刚刚购买的主机，点击管理，即可在页面中找到您想要的信息。接下来就是使用客户端连接了，没什么好说的，我就发个图吧。
