首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Require.Js 前端模块

前端模块化 (Require.js) ? 为什么要用 前端模块化 早期,js代码量小, 所有Javascript代码可以都写在一个文件里面,只要加载一个js文件就够了。...通用模块定义 sea.js 依赖延迟:在需要的时候才去加载依赖项 模块化的实现(require.js) 下载后,把它放在目录下面,就可以加载了   定义模块require.js中,每个模块也是分成单独的文件保存的 每一个模块中都有自己单独的作用域!...}) 引用模块require.js中,引用一个模块使用require.js提供的函数 require() 语法:require(["模块文件的路径(不带.js后缀的)"], function(){...在require.js中,模块路径的查找方式, 一共有三种: 不做任何配置,直接以当前文件的路径作为参照 require([".

3.8K40
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JS模块化编程规范1——require.js

    概述 require.js是各种网络APP中非常常见的JS依赖库,它其实不仅仅是个模块加载器那么简单。它背后蕴含了一个非常重要的设计,也就是JS模块化编程。...后来随着require.js的推广和使用,就逐渐形成了AMD(The Asynchronous Module Definition),也就是"异步模块加载机制"。...这样,如果大家都约定使用同样的模块化规范设计,从一个框架到另外一个框架就没有成本,并且可以互相加载引入。 这里通过一个计算幂运算的例子,详细论述require.js的使用。 2..../script> 这句代码定义了脚本的加载入口,src当然是require.js的源代码,而data-main则会默认的将dota-main指定的js路径为根路径。...参考 【第67期】ES6 系列之模块加载方案 Javascript模块化编程(三):require.js的用法 JavaScript的模块化编程

    3.3K10

    模块化编程之require.js

    首先,加载的时候,浏览器会停止网页渲染,加载文件越多,网页失去响应的时间就会越长;其次,由于js文件之间存在依赖关系,因此必须严格保证加载顺序(比如上例的1.js要在2.js的前面),依赖性最大的模块一定要放到最后加载...require.js的诞生,就是为了解决这两个问题:   (1)实现js文件的异步加载,避免网页失去响应;   (2)管理模块之间的依赖性,便于代码的编写和维护。...require.js的加载: 使用require.js的第一步,是先去官方网站下载最新版本。 下载后,假定把它放在js子目录下面,就可以加载了。...那么,只需要写成下面这样就行了: data-main属性的作用是,指定网页程序的主模块...在上例中,就是js目录下面的main.js,这个文件会第一个被require.js加载。由于require.js默认的文件后缀名是js,所以可以把main.js简写成main。

    1.7K10

    Javascript模块化编程(三):require.js的用法

    这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战。 我采用的是一个非常流行的库require.js。...因此,require.js提供了一个优化工具,当模块部署完毕以后,可以用这个工具将多个模块合并在一个文件中,减少HTTP请求数。...五、AMD模块的写法 require.js加载的模块,采用AMD规范。也就是说,模块必须按照AMD的规定来写。 具体来说,就是模块必须采用特定的define()函数来定义。...六、加载非规范的模块 理论上,require.js加载的模块,必须是按照AMD规范、用define()函数定义的模块。...那么,require.js是否能够加载非规范的模块呢? 回答是可以的。 这样的模块在用require()加载之前,要先用require.config()方法,定义它们的一些特征。

    2.2K90

    模块化编程之require.js

    首先,加载的时候,浏览器会停止网页渲染,加载文件越多,网页失去响应的时间就会越长;其次,由于js文件之间存在依赖关系,因此必须严格保证加载顺序(比如上例的1.js要在2.js的前面),依赖性最大的模块一定要放到最后加载...require.js的诞生,就是为了解决这两个问题:   (1)实现js文件的异步加载,避免网页失去响应;   (2)管理模块之间的依赖性,便于代码的编写和维护。...require.js的加载: 使用require.js的第一步,是先去官方网站下载最新版本。 下载后,假定把它放在js子目录下面,就可以加载了。...那么,只需要写成下面这样就行了: data-main属性的作用是,指定网页程序的主模块...在上例中,就是js目录下面的main.js,这个文件会第一个被require.js加载。由于require.js默认的文件后缀名是js,所以可以把main.js简写成main。

    1.7K50

    Javascript模块化编程(三):require.js的用法

    这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战。 我采用的是一个非常流行的库require.js。 一、为什么要用require.js?...require.js的诞生,就是为了解决这两个问题:   (1)实现js文件的异步加载,避免网页失去响应;   (2)管理模块之间的依赖性,便于代码的编写和维护。...因此,require.js提供了一个优化工具,当模块部署完毕以后,可以用这个工具将多个模块合并在一个文件中,减少HTTP请求数。 五、AMD模块的写法 require.js加载的模块,采用AMD规范。...六、加载非规范的模块 理论上,require.js加载的模块,必须是按照AMD规范、用define()函数定义的模块。...那么,require.js是否能够加载非规范的模块呢? 回答是可以的。 这样的模块在用require()加载之前,要先用require.config()方法,定义它们的一些特征。

    3.1K60

    JAVASCRIPT模块化3篇之三:require.js

    require.js的诞生,就是为了解决这两个问题: ?   (1)实现js文件的异步加载,避免网页失去响应;   (2)管理模块之间的依赖性,便于代码的编写和维护。...默认情况下,require.js假定这三个模块与main.js在同一个目录,文件名分别为jquery.js,underscore.js和backbone.js,然后自动加载。...因此,require.js提供了一个优化工具,当模块部署完毕以后,可以用这个工具将多个模块合并在一个文件中,减少HTTP请求数。 五、AMD模块的写法 require.js加载的模块,采用AMD规范。...六、加载非规范的模块 理论上,require.js加载的模块,必须是按照AMD规范、用define()函数定义的模块。...那么,require.js是否能够加载非规范的模块呢? 回答是可以的。 这样的模块在用require()加载之前,要先用require.config()方法,定义它们的一些特征。

    1.6K20

    Android多模块构建合并aar解决方案

    前言 前段时间,我在实现gradle多模块构建遇到一个问题,以前我们基本上是以jar包形式让开发者集成到工程中使用,但自从Android Studio中有了多module的概念,而我们的SDK也是分了多个模块进行构建的...,但我们这里有个问题就是模块之间是相互关联的,不能针对每个模块单独打包,而每个module都会生成对应的aar,但并不会把依赖的module代码打进去,别问我为什么知道,你将aar后缀改为zip,然后反编译...所以我们这边就有了合并aar这样的一个需求,下面就告诉大家怎么来实现。...android-fat-aar 当时我遇到这个问题,就去github搜了一下,已经有人将合并aar的脚本开源出来了,开源地址如下: https://github.com/adwiv/android-fat-aar...flatDir { dirs'libs' } } dependencies { compile(name:'your aar', ext:'aar') } 多模块构建合并

    4.6K30

    SAP 资产模块-5.资产合并与拆分

    SAP资产管理模块是SAP系统中的一个重要财务模块,包括资产的创建、采购、折旧计算、处置、转移、盘点等功能,主要用于跟踪、管理和计划企业的固定资产,帮助企业实现对固定资产的全面管理和控制。...对资产在同一公司代码下进行资产合并与拆分过账,实质都是资产价值的转移,只不过某资产的部分价值转移到一个新的资产就叫做拆分;而某资产的全部价值转移到另一个已有资产就叫做合并。...一、ABUMN -资产合并操作 操作步骤: 1.输入事务代码 ABUMN,确认资产号、过账日期、合并到已有资产等信息 2.点“附加明细“,选择记账期间、凭证类型(AA-资产过账)...点保存按钮,即完成资产在同一公司代码下的资产合并过账。

    35910

    nginx-合并前端资源nginx-http-concat模块

    今天我们来分享如何减少http请求优化我们的服务之nginx-http-concat模块....通常来说合并css、js也是为了将很多小的css文件全部合并成一个http返回,也是非常重要的优化手段,对于前端工程实现来说,也比较清晰.下面我们来实际操作下阿里开源的基于nginx的开源实现。.../nginx-http-concat/ make && make install 查看nginx编译了那些额外的模块 /usr/local/nginx/sbin/nginx -V nginx version...原因是:Nginx1.7.6使用了标准的MIME-Type:application/javascript,而本模块的代码中,写的是application/x-javascript的类型,不匹配,所以导致这个问题.../javascript;3、等待这个模块更新 https://github.com/alibaba/nginx-http-concat/issues/21 只有js出现了这种问题,css是没有问题的。

    1.9K20

    js模块化编程之彻底弄懂CommonJS和AMDCMD!(转)

    require.js的诞生,就是为了解决这两个问题:   (1)实现js文件的异步加载,避免网页失去响应;   (2)管理模块之间的依赖性,便于代码的编写和维护。...二、require.js的加载 使用require.js的第一步,是先去官方网站下载最新版本。 下载后,假定把它放在js子目录下面,就可以加载了。   ...因此,require.js提供了一个优化工具,当模块部署完毕以后,可以用这个工具将多个模块合并在一个文件中,减少HTTP请求数。 五、AMD模块的写法 require.js加载的模块,采用AMD规范。...六、加载非规范的模块 理论上,require.js加载的模块,必须是按照AMD规范、用define()函数定义的模块。...那么,require.js是否能够加载非规范的模块呢? 回答是可以的。 这样的模块在用require()加载之前,要先用require.config()方法,定义它们的一些特征。

    1.6K30

    动态表单之表单组件的插件式加载方案

    AMD 规范 使用 require.js 去加载一个符合 AMD 规范的 JS 文件。...关于这一点我们可以看下遵循 AMD 规范的 require.js 是怎么做的。...], ()=>{ // code }) 因为通过插入 Script 的方式引入 JS 资源,JS 会被立刻执行,所以在 require.js 中加载进来的 JS 模块都是被 define 方法包裹着的...所以就有了组件合并的需求。 在配置表单页面的时候当用户发布该页面的时候,服务端建一个临时项目,将该页面的所有涉及到的自定义组件安装到该项目上,并 export 出去。...编译打包,生成符合 UMD 规范的文件模块。然后再按照以上方式进行引入。这样就解决了多文件合并的问题。 总结 最后方案其实很简单,只是对 UMD 规范打包的一种灵活应用。

    2.5K40

    几个常见的前端模块管理器

    Require.js的问题在于各种参数设置过于繁琐,不容易学习,很难完全掌握。而且,实际应用中,往往还需要在服务器端,将所有模块合并后,再统一加载,这多出了很多工作量。 ?...今天,我介绍另外四种前端模块管理器:Bower,Browserify,Component和Duo。它们各自都有鲜明的特点,很好地弥补了Require.js的缺陷,是前端开发的利器。...$ bower update jquery 如果不给出模块的名称,则更新所有模块。 bower uninstall命令用于卸载模块。   ... Browserify编译的时候,会将脚本所依赖的模块一起编译进去。这意味着,它可以将多个模块合并成一个文件。.../background-image.jpg');   } 编译时,Duo自动将normalize.css和layout.css,与当前样式表合并成同一个文件。

    77230
    领券