应届毕业生，目前正在找工作，简历需要所以开发了这个app。刚开始开发也是一脸懵逼，因为没得后台，一些逻辑功能也不知道怎么拓展。好在看到了追书神器api接口，顿时让我决心做出这一款app来。
开发一个阅读器系统难度确实不小，几乎不可能给一个应届生完整的开发出来。所以本次开发借鉴了几个前辈开发的vue阅读项目，加以改进，便做出了一个完整的vue阅读app。原创30%，基本上是界面，新加了七八个功能，解决了前辈阅读器上的绝大部分bug，并成功添加路径打包成app。废话不多说，开始讲项目：
项目地址：https://github.com/charCR2/vu...
希望帮我点星，谢谢
前言
本次开发是vue全家桶模式，项目结构简单，并且做了大量的优化。所以启动非常迅速下载项目后
//install dependencies
npm install
//serve with hot reload at localhost:8080
npm run dev
//build for production with minification
npm run build
就可以打包项目，下面是技术栈
技术栈：vue + vue-router + vuex + muse-ui + mint-ui + axios
目录分析以及功能简介
下面是项目结构图
实现功能：
- 小说模糊搜索
- 书架功能（经过优化）
- 章节跳转
- 小说分类（修改界面）
- 小说详情
- 阅读器背景、字体、字体大小更改(修改加优化)
- 换源（经过优化）
- 排行榜功能（没做好）
- 小说删除
- 目录
截图：
遇到的问题以及解决方法
1.项目组件复用导致再次带入参数不会渲染页面
使用监听事件，监听路由是否进入当前页面，是就执行更新页面的函数
'$route' (to, from) {
if(to.name === 'reader'){
this.getChapters();
this.getSources();
this.$store.commit()
}
}
2.项目组件多，加载不快
(1).图片使用懒加载 v-lazy="url" ，注意这是mint-ui的插件
(2).路由使用懒加载
path: '/',
name: 'home',
component: resolve => require(['@/components/home'], resolve),
(3).在父组件的
//页面设置
其他的啥服务端渲染就算了，比较难而且也用不到。毕竟只是一个学习项目
3.跨域问题
本次开发使用的是代理追书神器api，是不需要后台认证直接可以跨域的接口，以实现在移动端显示的效果。而我所给的代码里是没有代理的追书神器api，只能在开发模式下运行。我会把代理api的链接完整地址注释在原api.js里，接口地址在fetch.js里。
最新修改：才发现手机上无跨域问题，所以重新写了代码，速度飞快了，哈哈
原版api跨域实现方法，在项目config->index.js里加入下面红框代码（已在代码中实现）：
4.静态资源问题
静态资源分为静态js，css文件一类和图片、字体一类。一般前者直接放在src里的文件夹里没事，但后者需要注意，因为vue是单页面程序，图片、字体之类的东西是需要引入到页面之中的。尤其是图片（没有写在css属性background里的），如果写src的绝对地址不会出现错误（webpack会把这种写法的图片转换成流处理模式），但如果是：src=“‘../../static/’+index”列表渲染在手机上是实现不出来的，因为打包成app后目录结构改变，而列表渲染后你的url是原项目的绝对地址，你需要去特地看一下app下的资源结构，目前没解决这问题。
字体安装方法：
首先在assets文件夹导入字体，然后在同级reset.css里引入字体
接着需要在webpack.base.conf.js里设置limit（单位是byte），大于你的字体文件大小就可以了，值得一提的是最好不要导入大于4m的字体文件，最好不到导入超过5个字体文件。这样会让项目加载变慢，手机好任性我无话可说。嘿嘿。
因为在打包项目中目录结构改变，还需要加入publicPath（你引用的css文件和你字体文件的位置）具体如下：
图片css引入简单多了但也要设置publicPath，是在bulid——>utils.js里，这是静态文件夹static下目录的图片位置设置：
5.打包
使用工具Hbuilder，界面简单，操作方便，具体细节戳下面链接。最后一道工作，修改config->index.js里的build规范下的一个属性，“/”改成“./”。注意是build下的规范：
感谢
借鉴过的前辈的东西，附上链接：
vue的APP打包：https://blog.csdn.net/zhoudan...
wum阅读：https://github.com/windjourne...
n阅读：https://github.com/zimplexing...
追书神器api：https://github.com/zimplexing...