zoukankan      html  css  js  c++  java
  • vue构建完整项目-以及实现

    简介

    由于开发vue项目的时候,需要重新搭建项目的架子,比较麻烦,其实之前做过的项目好多都可以直接拿过来用,比如接下来的这个项目,就可以满足平常的vue单页面开发.

    该项目包括了: 全局配置axios , 全局配置接口集合 , 切换页面动画 , 全局配置vuex(其中vuex做的很经典 规范 ,可以参考)页面请求数据增加loading效果

    项目地址: https://github.com/YalongYan/vue-markert-h5

    主要结构目录

    .
    ├── build                                       // webpack配置文件
    ├── config                                      // 项目打包路径
    ├── src                                         // 源码目录
    │   ├── api                                     // 接口
    │   │   ├── axios.config.js                     // axios 配置文件
    │   │   └── index.js                            // 接口集合
    │   ├── assets                                  // 资源
    │   │   ├── css
    │   │   │   └── common.css                      // 公共样式文件
    │   │   └── loading.gif                         // 加载图
    │   ├── components                              // 组件集合
    │   ├── lib                                     // 包括公共方法和数组等的定义
    │   ├── pages                                   // 页面
    │   ├── router
    │   │   └── router.js                           // 路由配置
    │   ├── vuex                                    // vuex的状态管理
    │   │   ├── modules                             // store模块
    │   │   │   ├── base.js
    │   │   │   ├── carPicker.js
    │   │   │   └── user.js
    │   │   ├── index.js                            // 引用vuex,创建store
    │   │   └── mutation-types.js                   // 定义常量muations名
    │   ├── App.vue                                 // 页面入口文件
    │   └── main.js                                 // 程序入口文件,加载各种公共组件
    ├── static                                      // 静态资源
    │   ├── css
    │   │   └── reset.css                           // 重置节点的css
    │   └── images                                  // 图片
    ├── test                                        // 测试部分(暂时未用到)
    ├── index.html                                  // 入口html文件
    .
    
    

    由于请求的接口是我们内部使用的,所以大家参考代码的结构,使用方法就行,项目结构除了src 和static其他都是通用的,可以在此基础上直接开发,很方便.

  • 相关阅读:
    [FlareOn4]greek_to_me
    [FlareOn1]Sploitastic
    [FlareOn1]Creation
    [FlareOn1]5get_it
    esxi6.7中,显卡设置为直通步骤
    esxi6.7安装步骤
    nmcli命令详解
    查看指定进程的IO/CPU/MEM/带宽/显卡
    使用WSGIServer修改静态文件
    k8s配置多端口ingress
  • 原文地址:https://www.cnblogs.com/yalong/p/8917366.html
Copyright © 2011-2022 走看看