Angularjs1.x 项目结构

大部分的项目结构是以 directives , service, controller 为基础来搭建的项目架构的，但这里更偏向于以应用场景来进行项目架构，因此这里的目录结构可能与您之前遇到的结构不同，如果有不喜欢的小伙伴请只看技术不讨论架构，如果觉得好的可以在这个的架构基础上提出改进意见

项目描述

项目以一个聊天室为场景的应用，实现用户列表，对话，朋友圈，基本设置等基础功能

项目拓展

实现聊天室功能后，接入电商模式，实现产品列表，下单，支付

项目结构

本项目以 angularjs 为核心框架，通过 gulp+webpack 进行打包和发布

结构如下

• project (项目目录)

  • dist （发布目录）
  • node_modules （NODE 模块）
  • src （源码目录）
    
    • app （应用目录）
      
      • images （图片目录）
      • scss （scss 样式目录）
        
        • mixin
          
          • _button.scss （mixin 文件）
        • app.scss （scss 统一调用文件）
      • pages （页面目录）
        
        • home （主页面）
        • chat （聊天页面）
        • contact （通讯录）
        • circle （圈子）
          
          • circle.js
          • circle.html
        • setting （基本设置）
      • sections （块目录）
        
        • public
          
          • footer.js
          • footer.html
      • services （factory,service,provider）
        
        • user
          
          • user.js
        • func (通用函数 service 目录)
          
          • base64.js
          • jssdk.js
          • md5.js
      • filters （过滤器目录）
        
        • range
          
          • range.js
      • components （组件目录）
        
        • alert
          
          • alert.js
          • alert.html
        • button
          
          • button.js
          • button.html
        • …
      • font （字体源文件目录）
        
        • scss
        • svg
    • index.html （入口文件）

  期望，麻雀虽小，五脏俱全，希望这样的一个结构能让开发人员更清晰的知道每个应用场景所在的工作目录，以期达到高效便捷开发方式。

补充：项目准备在 GIT@OSC 开源，并且会跟着博文一步步的往下完善项目内容，因为不是事先准备，过程中肯定会有错误出现，因此希望小伙伴们多 FORK 以及 PUSH 内容上来（仅合并能自动合并的部分），后台 REST 部分，准备采用 YII2.0 框架，不熟悉的小伙伴也可以不用管他，这是后端的事，搞前端的小伙伴只需要处理好数据展示即可，这里尽量采用 MOCK 数据来模拟