zoukankan      html  css  js  c++  java
  • vue 仿ele 开发流程

    技术栈:

    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 组件销毁后调用
  • 相关阅读:
    几道算法题及学java心得
    css入门
    关于 移动端整屏切换专题 效果的思考
    css3实现卡牌旋转与物体发光效果
    九方格抽奖插件
    绑定弹窗事件最好的方法,原生JS和JQuery方法
    整屏滚动效果 jquery.fullPage.js插件+CSS3实现
    自定义 页面滚动条
    有趣的HTML5 CSS3效果
    CSS3 过渡与动画
  • 原文地址:https://www.cnblogs.com/crazycode2/p/6774653.html
Copyright © 2011-2022 走看看