本文将演示如何合并与压缩一个基于RequireJS的项目。本文中将用到苦干个工具，这其中就包括Node.js。 因此，如果你手头上还没有Node.js可以点击此处下载一个。 动机 关于RequireJS已经有很多文章介绍过了。这个工具可以将你的JavaScript代码轻易的分割成苦干个模块(module)并且保持你的代码模块化与易维护性。这样，你将获得一些具有互相依赖关系的JavaScript文件。仅仅需要在你的HTML文档中引用一个基于RequireJS的脚本文件，所有...
无论简单还是复杂的Web应用，都由一些HTML、JavaScript、CSS文件组成。通常开发者会通过JQuery、Knockout、Underscore等等这样的第三方JavaScript框架来提高开发速度。由于这些JavaScript框架都针对特定的用途开发而且已经得到了“验证”，所以直接使用它们就比自己从头实现所需要的功能显得更为合适。然而，伴随着应用的复杂度不断上升，写出干净、低耦合、可维护的代码变得越来越重要。在这篇文章里，我将解释 RequireJS框架如何...
为什么学习RequireJS？ 像我这种菜鸟，会提到海量文章里提到的AMD、JS模块化编程、异步... ... 等等 RequireJS会让你以不同于往常的方式去写JavaScript。你将不再使用script标签在HTML中引入JS文件，以及不用通过script标签顺序去管理依赖关系。 RequireJS是一个Javascript 文件和模块框架，它可以帮我们去管理js代码（我的理解）。 深入学习，我们便会被迫接受一系列的名词：data-main、require、define、baseUrl、paths、shims、...
在项目使用了AngularJS框架，用RequireJS做异步模块加载（AMD），在做文件合并压缩时，遇到了一些坑，有些只是解决了，但不明白原因。 那些坑 1. build.js里面的paths必须跟main.js里面的保持一致。 这个build.js就是r.js使用的配置文件，而main.js就是RequireJS的main文件。在合并压缩时候，build.js文件里面也需要写paths，而且还是跟main.js一样，我很奇怪为什么就不能识别main里面的require.config的paths，省得合并的时候还要...
本文采取循序渐进的方式，从理论到实践，从RequireJS官方API文档中，总结出在使用RequireJS过程中最常用的一些用法，并对文档中不够清晰具体的内容，加以例证和分析，分享给大家供大家参考，具体内容如下 1. 模块化 相信每个前端开发人员在刚开始接触js编程时，都写过类似下面这样风格的代码：var a = 1;var b = 2;var c = a * a + b * b;if(c> 1) {alert('c > 1');}function add(a, b) {return a + b;}c = add(a,b);请点击这些代码...
项目中大都使用模块化开发，requireJS作为AMD模块开发的典范，所以有必要学习下。通过一步步利用requireJS编写demo，从而学习requireJS的一个整体开发流程以及自我使用requireJS的一些感受。 AMD：一种基于模块的异步加载JavaScript代码的机制，它推荐开发人员将JavaScript代码封装进一个个模块，对全局对象的依赖变成了对其他模块的依赖，无须再声明一大堆的全局变量。通过延迟和按需加载来解决各个模块的依赖关系。模块化的JavaS...
本文实例讲述了seajs和requirejs模块化。分享给大家供大家参考，具体如下： 如今，webpack、gulp等构件工具流行，有人说seajs、requirejs等纯前端的模块化工具已经被淘汰了，我不这么认为，毕竟纯前端领域想要实现模块化就官方来讲，还是有一段路要走的。也因此纯前端的模块化工具依然有价值，而且就我了解一些中小企业一直都在用纯前端的模块化手段。 如今，重新关注seajs和requirejs，不求理解多么深刻，要求会用能用就可以。 模...
本文实例讲述了RequireJS用法。分享给大家供大家参考，具体如下： 建立如下工程目录：|-test |-index.html |-index.js |-main.js |-require.min.js |-test.js其中，index.html如下： <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Index</title> </head> <body> <script type="text/javascript" data-main="main.js" src="require.js"></script> </body> </html>data-main为入口。 main.js...
requireJs简介参数配置requireJS 常用的方法与命令也就两个，因此requireJS使用起来非常简单。require define其中define是用于定义模块，而require是用于载入模块以及载入配置文件。 define([id,deps,] callback); require(deps[,callback]);加载配置文件独立的引入配置文件也有两种方式，一种是通过script标签加载外部JS文件形式： <script src="js/require.js"></script> <script src="js/app.js"></script>另一种方式则是使用 r...
在前文中我们不止一次强调过模块化编程的重要性，以及其可以解决的问题： ① 解决单文件变量命名冲突问题 ② 解决前端多人协作问题 ③ 解决文件依赖问题 ④ 按需加载（这个说法其实很假了） ⑤ ...... 为了深入了解加载器，中间阅读过一点requireJS的源码，但对于很多同学来说，对加载器的实现依旧不太清楚 事实上不通过代码实现，单单凭阅读想理解一个库或者框架只能达到一知半解的地步，所以今天便来实现一个简单的加载器 加载器...
1.使用 1.1 加载 JavaScript 文件 RequireJS的目标是鼓励代码的模块化，它使用了不同于传统<script>标签的脚本加载步骤。可以用它来加速、优化代码，但其主要目的还是为了代码的模块化。 RequireJS以一个相对于baseUrl的地址来加载所有的代码。 页面顶层<script>标签含有一个特殊的属性data-main，require.js使用它来启动脚本加载过程，而baseUrl一般设置到与该属性相一致的目录。 baseUrl亦可通过RequireJS config手动设置。如果...
本文实例讲述了requireJS模块化实现返回顶部功能的方法。分享给大家供大家参考，具体如下： 引用requireJs <script src="require.js" data-main="main"></script>html部分 <!DOCTYPE html> <html> <head lang="en"><meta charset="UTF-8"><title></title><style>body{padding: 0; margin: 0; height: 3000px}.btn{width: 80px; height: 80px;position: fixed; bottom: 0; left: 50%; background: #ddd}</style><script src="requir...
requirejs是干啥的啊？ 曾经，我们将一些js组件放到不同的文件，然后通过script标签引入，如果几个组件有依赖，那么要小心了，你必须将被依赖的放到前面，否则的话会出现啥啥啥is undefined或者啥啥啥is not a function之类的错误。比如一个jquery的插件显然是依赖jquery核心库的，所以jquery核心库文件必须先引入。项目小组件少依赖简单还好，要是项目大组件多依赖复杂就糟糕了。咋办？用requirejs啊！ 只要按照requirejs规范写，...
以前都是支持 司徒正美 的，毕竟咱们也是跟着 司徒正美 一起走进了前端的世界。所以一般MVVM都是用avalon的，当然也是考虑到项目需要支持IE6,7,8的考虑。当然在用的时候也有一些小坑和bug,都处理了。今年正美正好升级avalon2.0，加入虚拟dom的时候，不稳定了，就考试寻找其他的mvvm框架。 看了比较流行的一些框架，最后选择了vue。选择他的原因是 文档比较全，而且还有中文的（你懂的），生态圈比较好，有vux, vue-loader, vue-rou...
描述 知道requirejs的都知道，每一个页面需要进行模块化开发都得有一个入口js文件进行模块配置。但是现在就有一个很尴尬的问题，如果页面很多的话，那么这个data-main对应的入口文件就会很多。理论这样其实也没什么，但是到后面用grunt进行合并压缩就会有很多入口js，虽然这个入口js都把配置的模块内容都压缩到里面了，但是各个入口合并压缩后的文件中其实都有很多重合的代码，所以考虑到这个就想到把所以的入口文件都统一了，使用...