技术栈:

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. java Integer parseInt()

    先来一段代码,代码很简单的,如下: public static void main(String[] args) { Integer a = Integer.parseInt("3" ...

  2. sql 预编译 in

    sql : "select * from json where id in (:paramName)"; 在使用Hibernate时,sql in的预编译语句为query.setP ...

  3. 洛谷P4587 [FJOI2016]神秘数(主席树)

    题面 洛谷 题解 考虑暴力,对于询问中的一段区间\([l,r]\),我们先将其中的数升序排序,假设当前可以表示出\([1,k]\)目前处理\(a_i\),假如\(a_i>k+1\),则答案就是\ ...

  4. 【Bzoj4555】【Luogu P4091】求和(NTT)

    题面 Bzoj Luogu 题解 先来颓柿子 $$ \sum_{i=0}^n\sum_{j=0}^iS(i,j)2^jj! \\ =\sum_{j=0}^n2^jj!\sum_{i=0}^nS(i,j ...

  5. Redux 和 Redux thunk 理解

    1: state 就像 model { todos: [{ text: 'Eat food', completed: true }, { text: 'Exercise', completed: fa ...

  6. 通过邮箱验证注册——.net代码

    在写一些面向用户的网站类的程序时,必不可少的一个就是注册,通常情况下,我们会选择邮箱验证后注册,或者手机发送验证码注册.上篇文章中已经简单的描述了手机验证注册,这篇主要介绍一下邮箱验证. 邮箱验证的步 ...

  7. JavaScript的程序构成

    JavaScript的程序构成主要从以下几方面做个总结:控制语句.函数 .事件驱动及事件处理,希望对读者有些帮助. 控制语句: if条件语句 基本格式 if(表述式) 语句段1: ...... els ...

  8. bzoj 2137: submultiple

                                                     Time Limit: 10 Sec  Memory Limit: 259 MB Submit: 23 ...

  9. [BZOJ2595]游览计划

    斯坦纳树居然不是数据结构... 斯坦纳树应该是类似最小生成树的问题,只不过它允许增加额外的点 比如这道题就是找关于景点的最小生成树,但还要付出最小的代价,加一些额外的格子把景点都连起来 套路是设$f_ ...

  10. 【深度优先搜索】mr353-取奶

    应该是USACO的题目,暂时没有找到对应出处. [题目大意] 农夫约翰要量取 Q(1 <= Q <= 20,000)夸脱(夸脱,quarts,容积单位——译者注) 他的最好的牛奶,并把它装 ...