Cacivy / zhihudaily

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

知乎日报

技术栈

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

Demo

戳我

To Do

• 列表页
• 文章页面
• 返回首页
• 异步加载组件
• 加载动画
• 过渡
• 图片懒加载
• 轮播图控件
• 返回首页定位
• 过往消息缓存
• 专栏
• 栏目总览及列表
• 查看赞
• v-lazy
• 查看评论
• 迁移至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:8081

License

MIT

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

Show