技术栈:

vue2 vuex vue-router axios webpack eslint better-scroll

1.安装插件

npm install vue-resource babel-runtime --save
npm install babel-preset-es2015 stylus-loader function-bind json-loader --save-dev

2.增加 better-scroll

.eslintrc.js

'space-before-function-paren': 0,
'semi': 0,
'no-new': 0,
'no-unused-vars': 0,
'no-undef': 0

安装插件:

npm install better-scroll fastclick iscroll v-tap vue-scroll --save

3.添加 axios

4.添加 vuex

5.打包

npm run build

.gitignore

.DS_Store
node_modules/
resource/
dist/
npm-debug.log

6.

npm install moment --save

制作时间过滤器,将 时间戳 变为 日期格式

7.设置mock 数据

build/dev-server.js

var appData = require('../static/data.json')

8.

npm install eslint-config-standard --save

9.

npm install watchpack --save

注:下面是关于这些钩子函数的解释:

hook 描述
beforeCreate 组件实例刚被创建,组件属性计算之前
created 组件实例创建完成,属性已绑定,但是 DOM 还未生成, $el 属性还不存在
beforeMount 模板编译/挂载之前
mounted 模板编译/挂载之后
mounted 模板编译/挂载之后(不保证组件已在 document 中)
beforeUpdate 组件更新之前
updated 组件更新之后
activated for keep-alive,组件被激活时调用
deactivated for keep-alive,组件被移除时调用
beforeDestory 组件销毁前调用
destoryed 组件销毁后调用

vue 仿ele 开发流程的更多相关文章

  1. vue 仿QQ 开发流程

    技术客栈: vue-cli vue2 vue-router vuex axios stylus webpack2 muse-ui 1.安装脚手架 npm install -g vue-cli 2.开始 ...

  2. Vue 实战项目开发流程

    一 基础配备 ## 一.环境搭建 #### 1.安装node - 去[官网](https://nodejs.org/zh-cn/)下载node安装包 - 傻瓜式安装 - 万一安装后终端没有node环境 ...

  3. Vue项目的开发流程

    我先安装的node.js 1.确认已安装了node.js,可在cmd中输入( node -v和npm -v),如显示出版号,说明安装成功 2.安装webpack 和webpack-cli 在全局下安装 ...

  4. vue 项目的开发流程

    1.$ node -v (检测node版本,node版本需要在 V4 以上) 2.全局安装vue $ npm install -g vue 3.安装脚手架 $ npm install -g vue-c ...

  5. Vue.js的复用组件开发流程

    本文由蔡述雄发表 接下来我们会详细分析下如何完成由多个组件组成一个复用组件的开发流程. 下面先看看我们的需求 列表组件quiList.vue 本节我们主要要完成这样一个列表功能,每一行的列表是一个组件 ...

  6. Vue 框架-12-Vue 项目的详细开发流程

    Vue 框架-12-Vue 项目的详细开发流程 首先,如果你还不了解 Vue 脚手架怎么搭建? 默认的环境中有哪些文件? 文件大概是什么作用? 那么,您要先查看之前的文章才有助于你理解本篇文章: Vu ...

  7. vue2.0 仿手机新闻站(一)项目开发流程

    vue仿手机新闻站: 1.拿到静态页面,直接用vue边布局,边写 2.假数据 没有用任何UI组件,切图完成 做项目基本流程: 1.规划组件结构 Nav.vue Header.vue Home.vue ...

  8. vue项目搭建和开发流程 vue项目配置ElementUI、jQuery和Bootstrap环境

    目录 一.VUE项目的搭建 1. 环境搭建 2. 项目的创建和启动 二. 开发项目 1. 配置vue项目启动功能 2. 开发vue项目 (1)项目文件的作用 (2)vue项目开发流程 (3)vue项目 ...

  9. Android之仿ele地图定位效果

    PS:最近项目要求,希望在选择地址的时候能够仿ele来实现定位效果.因此就去做了一下.不过ele使用高德地图实现的,我是用百度地图实现的.没办法,公司说用百度那就用百度的吧.个人觉得高德应该更加的精准 ...

随机推荐

  1. Junit3.8源码--核心类

    好久没画图了,看下这个序列图,还算比较清晰的: 以textui来分析: Test 顶层接口.TestSuite和TestCase均实现此接口,在具体执行的时候面向此接口编程,弱化类型,实现各自的执行流 ...

  2. 51nod 1052 (dp)

    最大M子段和 N个整数组成的序列a[1],a[2],a[3],…,a[n],将这N个数划分为互不相交的M个子段,并且这M个子段的和是最大的.如果M >= N个数中正数的个数,那么输出所有正数的和 ...

  3. J2EE技术架构

    一.简介 J2EE(Java 2 Platform, Enterprise Edition)是一个为大企业主机级的计算类型而设计的Java平台.Sun微系统(与其工业伙伴一起,例如IBM)设计了J2E ...

  4. python datetime处理时间(转)

    Python提供了多个内置模块用于操作日期时间,像calendar,time,datetime.time模块,它提供 的接口与C标准库time.h基本一致.相比于time模块,datetime模块的接 ...

  5. 【DFS】【打表】Lattice Animals

    [ZOJ2669]Lattice Animals Time Limit: 5 Seconds      Memory Limit: 32768 KB Lattice animal is a set o ...

  6. BZOJ 1116 [POI2008]CLO(并查集)

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=1116 [题目大意] Byteotia城市有n个towns,m条双向roads.每条ro ...

  7. [LOJ2541]猎人杀

    好题== 先转化一下,每个人被杀死后给他打标记,以后随机杀人时选到有标记的人就继续随机,这样并不会改变每个人被杀死的概率 直接算很难算,考虑容斥,我们枚举$S$表示在$1$死后才死的人至少在集合$S$ ...

  8. CSS3新增

    1 CSS3 的选择器 1.1 基本选择器 tagName .className #idName * slector,selector,selector 1.2 层级选择器 selector1 sel ...

  9. PHP5.3魔术方法 __invoke

    这个魔幻方法被调用的时机是: 当一个对象当做函数调用的时候, 如果对象定义了__invoke魔幻方法则这个函数会被调用, class Callme { public function __invoke ...

  10. web安全之如何防止CSRF跨站请求伪造

    CSRF(Cross-site request forgery)跨站请求伪造,也被称为“One Click Attack”或者Session Riding,通常缩写为CSRF或者XSRF,是一种对网站 ...