首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

模块系统

系统中的个体可称之为系统成员,这样,要构建一个系统,最基本层面需要做两件事: 定义系统成员:确定成员是什么。约定系统通讯:确定成员之间如何交互,遵循的规则是什么。...模块系统 Sea.js 是一个适用于 Web 浏览器端的模块加载器。在 Sea.js 里,一切皆是模块,所有模块协同构建成模块系统。Sea.js 首要要解决的是模块系统的基本问题: 模块是什么?...在 Sea.js 里,我们专注于 JS 模块(其他类型的模块可以转换为 JS 模块): 模块是一段 JavaScript 代码,具有统一的基本书写格式。模块之间通过基本交互规则,能彼此引用,协同工作。...Sea.js 遵循的是 CMD 规范,会在接下来的文档中详细阐述。 延伸阅读 function / bind 的救赎 继承与混合,略谈系统的构建方式

57520

关于 JS 模块化的最佳实践总结

sea.js 是一个模块加载器,是 AMD 规范的主要实现者之一。...sea.js 作为 AMD 规范的升级版,简化了使用方法,在使用上更加方便,值得推崇。但是 sea.js 便是浏览器开发中最佳的模块化解决方案吗?未必,还要看是什么类型的项目,后面会讲到。...结论 所以综上所述,在模块化方案上最佳选择是什么? 在小程序(包括小游戏)开发项目中,由于支持 ES6,所以小程序最好的模块化方案便是使用ES6模块规范。...至于是使用原生的 ES 模块规范,还是使用sea.js,要看具体场景。如果想页面尽快加载,sea.js 适合;如果是单页面网站,适合使用原生的 ES6 模块规范。...Node 9下import/export的丝般顺滑使用 Sea.js是什么? 前端模块化:CommonJS,AMD,CMD,ES6 Module 的加载实现

2.4K10

前端科普系列(3):CommonJS 不是前端却革命了前端

那 CommonJS 又是什么呢? 先来看下,它在维基百科上的定义: CommonJS 是一个项目,其目标是为 JavaScript 在网页浏览器之外创建模块约定。...二、为什么需要模块化 1、没有模块化时,前端是什么样子 在之前的《Web:一路前行一路忘川》中,我们提到过 JavaScript 诞生之初只是作为一个脚本语言来使用,做一些简单的表单校验等等。...2、CMD (Common Module Definition) 和 AMD 类似,CMD 是 Sea.js 在推广过程中对模块定义的规范化产出。Sea.js 是阿里的玉伯写的。...Sea.js 官网这么介绍 Sea.js: "Sea.js 追求简单、自然的代码书写和组织方式,具有以下核心特性:" "简单友好的模块定义规范:Sea.js 遵循 CMD 规范,可以像 Node.js...一起来看看,ES Module是什么样的。

1K40

seajs简记

参考seajs快速入门 一、前端模块化的价值 解决命名冲突 摆脱文件依赖 性能优化 提高可维护性 seajs.use方法调用 通过exports暴露接口 通过require引入依赖 二、Sea.js...的常用 API seajs.config base string    Sea.js 在解析顶级标识时,会相对 base 路径来解析  seajs.use 用来在页面中加载模块 require...顶级标识:顶级标识不以点(.)或斜线(/)开始, 会相对模块系统的基础路径(即 Sea.js 的 base 路径)来解析 四、 使用步骤 引入sea.js文件(方法与引用jQuery相同) 配置信息 在...'' : 'json' 29 ], 30 31 // 调试模式 32 debug: true, 33 34 // Sea.js 的基础路径 35 base: 'http://example.com.../path/to/base/', 36 37 // 文件编码 38 charset: 'utf-8' 39 }); 配置sea.js的基础路径  及加载模块 1 通过 use 方法,可以在页面中加载任意模块

1.4K20

前端科普系列(3):CommonJS 不是前端却革命了前端

那 CommonJS 又是什么呢? 先来看下,它在维基百科上的定义: CommonJS 是一个项目,其目标是为 JavaScript 在网页浏览器之外创建模块约定。...二、为什么需要模块化 1、没有模块化时,前端是什么样子 在之前的《Web:一路前行一路忘川》中,我们提到过 JavaScript 诞生之初只是作为一个脚本语言来使用,做一些简单的表单校验等等。...2、CMD (Common Module Definition) 和 AMD 类似,CMD 是 Sea.js 在推广过程中对模块定义的规范化产出。Sea.js 是阿里的玉伯写的。...Sea.js 官网这么介绍 Sea.js: "Sea.js 追求简单、自然的代码书写和组织方式,具有以下核心特性:" "简单友好的模块定义规范:Sea.js 遵循 CMD 规范,可以像 Node.js...一起来看看,ES Module是什么样的。

60210

前端模块化开发的价值

本文将从实际项目中遇到的问题出发,讲述模块化能解决哪些问题,以及如何使用 Sea.js 进行前端的模块化开发。 恼人的命名冲突 我们从一个简单的习惯出发。...为了方便描述,我们使用 Sea.js 来作为模块化开发框架。 使用 Sea.js 来解决 Sea.js 是一个成熟的开源项目,核心目标是给前端开发提供简单、极致的模块化开发体验。...使用 Sea.js,在书写文件时,需要遵守 CMD (Common Module Definition)模块定义规范。一个文件就是一个模块。...*/); }); 首先要在页面中引入 sea.js 文件,这一般通过页头全局把控,也方便更新维护。...Sea.js 还提供了 nocache、debug 等插件,拥有在线调试等功能,能比较明显地提升效率。前端性能优化。Sea.js 通过异步加载模块,这对页面性能非常有益。

1K20

可能是最详细的UMD模块入门指南

回顾 之前也写了几篇关于javascript模块的博客,链接如下: 回头再看JS模块化编程[2] 回头再看JS模块化编程之AMD[3] sea.js的同步魔法[4] 近几天准备总结一下javascript...factory()) } else if (typeof define === 'function' && define.cmd) { console.log('是CMD模块规范,如sea.js...给个sea.js调用UMD的效果页面链接,sea.js调用UMD模块[9] 而nodejs调用UMD模块需要执行node命令, node umd-simple-used-by-nodejs 效果如下:...'我调用了依赖模块', depModule) // ...省略了一些代码,去代码仓库看吧 return { name: '我自己是一个umd模块' } })) 给个sea.js...的同步魔法: http://hexo.wbjiang.cn/sea.js%E7%9A%84%E5%90%8C%E6%AD%A5%E9%AD%94%E6%B3%95.html [5] Git仓库: https

2.8K20

前端模块化详解(完整版)

引入多个 后出现出现问题 请求过多 首先我们要依赖多个模块,那样就会发送多个请求,导致请求过多 依赖模糊 我们不知道他们的具体依赖关系是什么,也就是说很容易因为不了解他们之间的依赖关系导致加载先后顺序出错...或 exports.xxx=value 引入模块: require(xxx),如果是第三方模块,xxx为模块名;如果是自定义模块,xxx为模块文件路径 此处我们有个疑问:CommonJS暴露的模块到底是什么...在 Sea.js 中,所有 JavaScript 模块都遵循 CMD模块定义规范。.../module4') m1.show() m4.show() }) (2)sea.js简单使用教程 ①下载sea.js, 并引入 官网: http://seajs.org/ github : https...://github.com/seajs/seajs 然后将sea.js导入项目: js/libs/sea.js ②创建项目结构 |-js|-libs|-sea.js|-modules|-module1.

1.2K20

前端模块化详解(完整版)

引入多个 后出现出现问题 请求过多 首先我们要依赖多个模块,那样就会发送多个请求,导致请求过多 依赖模糊 我们不知道他们的具体依赖关系是什么,也就是说很容易因为不了解他们之间的依赖关系导致加载先后顺序出错...或 exports.xxx=value 引入模块: require(xxx),如果是第三方模块,xxx为模块名;如果是自定义模块,xxx为模块文件路径 此处我们有个疑问:CommonJS暴露的模块到底是什么...在 Sea.js 中,所有 JavaScript 模块都遵循 CMD模块定义规范。.../module4') m1.show() m4.show() }) (2)sea.js简单使用教程 ①下载sea.js, 并引入 官网: http://seajs.org/ github : https...://github.com/seajs/seajs 然后将sea.js导入项目: js/libs/sea.js ②创建项目结构 |-js|-libs|-sea.js|-modules|-module1.

2.1K30
领券