基于vue2.0构建的在线电影网【film】,webpack + vue + vuex + vue-loader + keepAlive + muse-ui + cordova 全家桶,cordova 打包成APP

从零开始搭建,适合新手练手参考。GitHub地址,api来源于网上,仅供开发参考之用,禁用于商业,否则后果自负。

在线demo

apk安装包后续再放出吧 O(∩_∩)O

屏幕截图,该项目使用了响应式布局,适配全分辨率的屏幕

移动端效果


启用侧边栏模式

PC端效果

主要特色:

  1. 组件化开发
  2. 下拉刷新
  3. 无限加载
  4. 浏览历史
  5. 响应式布局
  6. 缓存数据
  7. 收藏
  8. 视频播放
  9. md风格模式
  10. 开发中...

目录结构

  1. # web目录结构
  2. ├─build # build配置目录
  3. ├─config # 相关配置
  4. ├─screenshot # 屏幕截图
  5. ├─src # 项目源码主目录
  6. ├─assets # 资源
  7. └─less # less通用文件目录
  8. ├─components # 页面及其组件
  9. ├─router # 路由
  10. └─vuex # vuex,其中包含了全局api,状态管理器
  11. └─modules # moduless
  12. ├─static # 外部资源引入
  13. ├─css # 外部样式
  14. ├─font # 字体图标
  15. └─woff # 字体图标
  16. └─js # 外部js
  17. └─test # 测试用,不用管这个
  18. ├─e2e
  19. ├─custom-assertions
  20. └─specs
  21. └─unit
  22. └─specs

A Vue.js project

运行

  1. npm install
  2. npm run dev
  3. npm run build

For detailed explanation on how things work, checkout the guide and docs for vue-loader.

基于vue2.0的在线电影APP,的更多相关文章

  1. 基于vue2.0的一个豆瓣电影App

    1.搭建项目框架 使用vue-cli 没安装的需要先安装 npm intall -g vue-cli 使用vue-cli生成项目框架 vue init webpack-simple vue-movie ...

  2. 基于vue2.0的分页组件开发

    今天安排的任务是写基于vue2.0的分页组件,好吧,我一开始是觉得超级简单的,但是越写越写不出来,写的最后乱七八糟的都不知道下句该写什么了,所以重新捋了思路,小结一下- 首先写组件需要考虑: 要从父组 ...

  3. 基于vue2.0前端组件库element中 el-form表单 自定义验证填坑

    eleme写的基于vue2.0的前端组件库: http://element.eleme.io 我在平时使用过程中,遇到的问题. 自定义表单验证出坑: 1: validate/resetFields 未 ...

  4. 基于vue2.0打造移动商城页面实践 vue实现商城购物车功能 基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果

    基于vue2.0打造移动商城页面实践 地址:https://www.jianshu.com/p/2129bc4d40e9 vue实现商城购物车功能 地址:http://www.jb51.net/art ...

  5. vue-swiper 基于Vue2.0开发 轻量、高性能轮播插件

    vue-swiper 基于 Vue2.0 开发,基本满足大部分功能 轻量.高性能轮播插件.目前支持 无缝衔接自动轮播.无限轮播.手势轮播 没有引入第三方库,原生 js 封装,打包之后只有 8.2KB ...

  6. Vue2.0 render:h => h(App)

    new Vue({ router, store, //components: { App } vue1.0的写法 render: h => h(App) vue2.0的写法 }).$mount( ...

  7. 基于Vue2.0+Vue-router构建一个简单的单页应用

    爱编程爱分享,原创文章,转载请注明出处,谢谢!http://www.cnblogs.com/fozero/p/6185492.html 一.介绍 vue.js 是 目前 最火的前端框架,vue.js ...

  8. 饿了么基于Vue2.0的通用组件开发之路(分享会记录)

    Element:一套通用组件库的开发之路 Element 是由饿了么UED设计.饿了么大前端开发的一套基于 Vue 2.0 的桌面端组件库.今天我们要分享的就是开发 Element 的一些心得. 官网 ...

  9. 基于vue2.0+vuex+localStorage开发的本地记事本

    本文采用vue2.0+vuex+localStorage+sass+webpack,实现一个本地存储的记事本.兼容PC端和移动端.在线预览地址:DEMO github地址:https://github ...

随机推荐

  1. WPS:为什么无法页眉页脚同前节(同前节是灰的)

    问题:,同前节是灰的 原因:全文只有一节,插入分节符就可以设置同前节了

  2. LeetCode-031-下一个排列

    下一个排列 题目描述:实现获取 下一个排列 的函数,算法需要将给定数字序列重新排列成字典序中下一个更大的排列. 如果不存在下一个更大的排列,则将数字重新排列成最小的排列(即升序排列). 必须 原地 修 ...

  3. php 数组汇总

    PHP 5 Array 函数 函数 描述 array() 创建数组. array_change_key_case() 返回其键均为大写或小写的数组. array_chunk() 把一个数组分割为新的数 ...

  4. Netty学习(三)高性能之ByteBuf源码解析

    原文链接: https://juejin.im/post/5db8ea506fb9a02061399ab3 Netty 的 ByteBuf 类型 Pooled(池化).Unpooled(非池化) Di ...

  5. 从零开始,开发一个 Web Office 套件(10):捕获键盘事件,输入文字

    这是一个系列博客,最终目的是要做一个基于 HTML Canvas 的.类似于微软 Office 的 Web Office 套件(包括:文档.表格.幻灯片--等等). 博客园:<从零开始, 开发一 ...

  6. Linux命令 之 “救命稻草”

    一.前言 虽然Linux操作系统图形界面已经退出,但由于大量的操作在终端操作比较快捷,所以,对linux命令的使用必不可少.在linux系统日常的学习和工作中,常常会出现有些命令忘记了或者该命令的参数 ...

  7. VuePress 博客优化之增加 Valine 评论功能

    前言 在 <一篇带你用 VuePress + Github Pages 搭建博客>中,我们使用 VuePress 搭建了一个博客,最终的效果查看:TypeScript 中文文档. 本篇讲讲 ...

  8. 5月11日 python学习总结 子查询、pymysql模块增删改查、防止sql注入问题

    一.子查询 子查询:把一个查询语句用括号括起来,当做另外一条查询语句的条件去用,称为子查询 select emp.name from emp inner join dep on emp.dep_id ...

  9. json.dumps参数之解

    宝藏参数,懂的都懂^-^ 说明:编译后print()打印内容,此内容以字符串紧凑输出,且无顺序,中文不可读..   应用:使用pycharm做接口测试时,print()打印出的接口下行,如下图:   ...

  10. Mysql等保部分加固

    一.等保要求:操作系统和数据库系统管理用户身份标识应具有不易被冒用的特点,口令应有复杂度要求并定期更换. 实施步骤: 启用口令复杂审核(5.6.6版本以上,才有此模块功能,需要重启mysql). 查看 ...