项目选型

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/liqianglai/article/details/59057039

更新时间：2018年1月23日09:37:04

图表的选择 echarts

• echarts http://echarts.baidu.com/

  1. 国人开发，文档全，便于开发和阅读文档
  2. 图表丰富

• highcharts https://www.hcharts.cn/

  1. 非商用免费
  2. 依赖jquery
  3. 文档丰富，使用简单
  4. 美观，功能强大

• g2 https://antv.alipay.com/g2/doc/

  1. 依赖jquery
  2. 大数据时代而准备的强大的可视化工具

构建工具 gulp webpack

• 在上一个项目的基础上增加html模板的使用
  
  • ejs 学习成本很小
• gulp和grunt的比较
  
  • gulp基于并行执行任务的思想（grunt 采用串行的方式执行任务）
  • 通过把API降到最少，你能在很短的时间内学会gulp，构建工作就像你设想的一样：是一系列流管道
  • 维护gulp更像是写代码
  • gulp（gulp通过利用Node.js强大的流，不需要往磁盘写中间文件，可以更快地完成构建） 性能优于 grunt （差别不是很大）
• es6的支持 使用babel编译ie8支持不好，因此webpack不再使用
• fis3 资源定位 内容嵌入 声明依赖
  
  • 社区薄弱，插件少

库的选择

• jquery-1.9.1 ie8 支持
• NProgress.js 进度条，增强用户体验 参考文档
• require.js和sea.js
  
  • sea.js 文档较少，有问题不宜解决
• sass 支持sassCore
  
  • sassCore 中文文档，便于开发
  • Compass

代码规范

• 文件命名
  
  • 全部采用小写方式， 以下划线分隔 my_project_name
  • 有复数结构时，要采用复数命名法 scripts, styles, images, data_models
• 字符编码 UTF-8
• 在属性上，使用双引号，不要使用单引号 使用双引号
• 样式表 尽量不要使用前缀，而是依靠autoprefixer来自动加前缀

技术栈

• yarn
• npm
• gulp
• require
• ejs
• sass
• sassCore
• 弹出框layer
• NProgress.js 参考文档
• 翻页插件paging
• 日期插件laydate
• 上传插件webuploader
• 富文本编辑器UEditor
• 图表库echarts
• 播放器jPlayer

项目代码

参考https://git.oschina.net/lailiqiang/platform.git