• vue项目架构


    一、工程说明:

          1.代码git仓库地址:git@gitlab.*****.git。

          2.目录结构:

                         1>.index.html 为build打包发布网页入口;

                         2>.lieda文件夹代码项目工程目录;

                         3>.static为build打包发布网页入口访问资源;

          注意:不是发布勿动index.html和static文件,勿在该层级目录下引入任何资源

           3.开发打开leida项目工程进行开发。

           4.git中test分支为测试环境;master为线上环境分支;

    二、工程注意事项:

           1.拉下分支更新资源文件:cnpm install

           2.接入第三方库(在package.json—>dependencies中添加可省去此步骤):

                              1>.Mint-ui H5开发快速集成组建;

                              2>.base64-js-codec加密;

                              3>.fastclick双击事件(地址:http://www.cnblogs.com/yexiaochai/p/3442220.html);

                              4>.font-awesome一套绝佳的图标字体库和css框架;

                              5>.js-cookie缓存;

                              6>. Lodash封装了诸多对字符串、数组、对象等常见数据类型的处理函数;    

                              7>.normalize.css让所有的浏览器上对于未定义的样式浏览效果达到一致;

                              8>.promise异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败);

                              9>.store.js轻松实现本地缓存(地址:http://www.cnblogs.com/lhb25/p/store-js-for-localstorage.html);

                              10>.vue-router路由跳转;

                              11>.animate.css动画;

                              12>.vue;

    三、工程目录结构:

          1.src问开发中文件目录,

               下:

    apis文件夹(所有的网络请求文件)

          —>根据不同需求功能建立不同的文件夹例如:advert文件夹;

          —>utils文件夹网络底层请求封装;

    assets文件夹:放图片资源,

      —>下根据不同的页面新建不同的文件夹再放入资源图片; 

    components文件夹:公用封装组建,

    —>根据功能划分新建功能文件夹然后新建组建; 

    filters文件夹:处理业务显示js文件,例如(处理职位类型,公司规模,时间显示的js文件):

    export let genderRequired = function(id){

      if(id==0){

        return "不限"

      }else if(id==1){

        return "男士优先"

      }else if(id==2){

        return "女士优先"

      }else{

        return "";

      }

    routers:路由配置文件;

    views:页面代码文件

    —>根据不同的业务建立文件夹!

    styles:不同的css样式封装;

     四、打包发布流程;

            1.测试域名为:lie*****.com 对应的分支为test;

            2.线上域名为:暂时没配置  对应的分支为master;

            3.npm run build 等待生成dist文件(dist文件为打包之后的文件资源包);

            4.替换一级目录下的index.html文件和static文件夹;

            5.上传打包后代码到git上test分支;

            6.进入ci.*****.com网页发布 —>前端发布(测试环境)—>***.h5项目—>立即构建

          

  • 相关阅读:
    计算机专业术语中英对照
    PhpStorm如何下载github上的代码到本地
    PDO学习
    Shell中特殊的变量
    Shell中变量的使用
    修改cmd的字体
    Shell的输入输出
    Shell入门第一课
    设计模式--观察者(Observer)
    eclipse中使用git提交代码到github
  • 原文地址:https://www.cnblogs.com/PeterWolf/p/7272109.html
Copyright © 2020-2023  润新知