前端架构设计_第1页
前端架构设计_第2页
前端架构设计_第3页
前端架构设计_第4页
前端架构设计_第5页
已阅读5页，还剩15页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、前端架构设计为什么要使用模块化？老旧项目单文件开发，维护难度越来越大。模块化后能带来什么？1、拆分成多文件，利于调试、后续功能修改。2、代码逻辑结构清晰、易读。3、增加程序的复用性。4、减少功能间的相关性。一个简单的页面：常用的 css 样式架构设计：最简单的拆分模块化后的 css 文件优点，增加了代码的复用性，少量增加了可维护性，但是变相的增加了 http 请求数量，增加了 http 开销。Sass、lesssass、less 是种 CSS 的开发工具，提供了许多便利的写法，大大节省了设计者的时间，使得 CSS 的开发， 变得简单和可维护。1、 支持嵌套写法，2、 支持变量，函数3、 支持引

2、入其他文件引入 sass 后的模块化项目Style.scss微复杂一点儿的页面：自适应到端：常用的方法：页面一多起来，十分的凌乱Sass 整理后的sass 文件关于 scss 文件内的格式：强制嵌套，已经拆分足够细的模块，所以有太深层次的代码，这样反而能够更加直观的找到代码所处的位置以及嵌套关系。Js 方向：事物与原子性。Seajs简单的功能需求：离开输入框的时候根据规则以及错误。是否错误，提示红框业务需求 2：如果出现错误，点击不提交。业务需求 3：增加请求后端验证邮箱等数据。出现问题：后端验证未完成的情况下，马上按钮每个功能拆分出来：依照器划分模块，依照原子性拆分模块。视图层显示功能。调用每个模块的接口（传参）。Module3Module2Module1Seajsdefine(function(requrie, exports, module)module.exports = ; exports.test = fucntion();define(String, Array, Function);define(“tmp/a”,function();define(“tmp/test/test”,tmp/a, funct

人人文库> 全部分类> 应用文书

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论