zhihudaily

知乎日报/主题日报/栏目总览

知乎日报

技术栈

  • vuejs + vue-router + vuex + vue-resource
  • swiper
  • jade + sass
  • normalize.css + animate.css

Demo

戳我

To Do

  • [x] 列表页
  • [x] 文章页面
  • [x] 返回首页
  • [x] 异步加载组件
  • [x] 加载动画
  • [X] 过渡
  • [x] 图片懒加载
  • [x] 轮播图控件
  • [x] 返回首页定位
  • [x] 过往消息缓存
  • [x] 专栏
  • [x] 栏目总览及列表
  • [x] 查看赞
  • [x] v-lazy
  • [x] 查看评论
  • [x] 迁移至vue2.0

目录

.
├── README.md
├── build webpack配置
├── config 配置文件
├── dist 打包文件夹
├── index.html 页面入口
├── node_modules 
├── package.json 
├── src 
	├── App.vue
	├── api
	│   ├── api.js 知乎api
	│   ├── index.js api接口
	│   ├── resource.js VueResource
	│   └── server.js node代理
	├── assets
	│   ├── logo.png
	│   ├── screenshots 截图
	│   │   ├── detail.gif
	│   │   ├── list.gif
	│   │   ├── list2.gif
	│   │   └── sections.gif
	│   └── styles
	│       ├── animate.scss 一些css3动画
	│       ├── reset.css cssreset
	│       ├── root.scss 整体样式
	│       └── zhihu.css 知乎文章页的默认样式
	├── components
	│   ├── NewDetail.vue 文章详情页
	│   ├── NewsList.vue 文章列表页
	│   ├── SectionList.vue 栏目总览
	│   ├── TopicList.vue 主题日报
	│   └── general 通用组件
	├── filter.js 过滤器
	├── main.js js入口
	├── router.js 路由
	├── utils
	│   ├── backtop.js
	│   └── lazyload.js 已改为v-lazy
	└── vuex
	    ├── action.js 
	    ├── logger.js
	    ├── plugins.js
	    └── store.js
├── static 静态资源,如默认加载图片
└── test karma测试

Dev

先安装依赖包

npm install

安装node-sass需要使用cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install node-sass

开启代理

npm run server

webpack-server

npm run dev

http://localhost:8080

License

MIT

感谢izzyleung提供的api,以及yatessss的图片代理解决方案

Show

Related Repositories

ZhiHuDaily-React-Native

ZhiHuDaily-React-Native

A Zhihu Daily(http://daily.zhihu.com/) App client implemented using React Native (Android and iOS). ...

Swift-ZhihuDaily

Swift-ZhihuDaily

ZhihuDaily with Swift language ...

zhihudaily-vue

zhihudaily-vue

知乎日报web版---vue ...

GO-ZhihuDaily

GO-ZhihuDaily

知乎日报 Web 版(Go 实现) ...

iZhihu

iZhihu

Zhihudaily powered by Node.js ...