requireJS,rjs,gulp简易实现

gulpfile.js

var gulp = require("gulp");
var rjs = require("requirejs");
gulp.task('build', function(cb){rjs.optimize({//文件输出路径  dir: './vajoy',//定义入口文件路径baseUrl: "./rjs",//单入口//mainConfigFile:"./rjs/main.js",//name:'main',//输出路径//out:'./rjs/dist/build-main.js',modules: [                    //要优化的模块{ name:'main'}            //说白了就是各页面的入口文件，相对baseUrl的路径，也是省略后缀“.js”],optimize: "uglify",//相对baseUrl的路径,定义依赖模块的路径paths: {    a: './js/a',jquery: './js/jquery',}}, function(buildResponse){// console.log('build response', buildResponse);cb();}, cb);//运行 gulp build

main.js

// JavaScript Document
require.config({baseUrl: "js",paths: {"jquery":"jquery","a":"a"}});
require(['jquery','a'],function($,a){$("#btn").on("click",function(){a();})})

html

<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>requireJS</title><script src="require.js" defer async data-main="./main.js" ></script>
</head><body>
<input type="button" value="点击" id="btn">
</body>
</html>

参考文章
http://www.tuicool.com/articl... r.js
http://www.cnblogs.com/2050/p... gulp
http://m.blog.csdn.net/articl... require.js文件合并

requireJS,rjs,gulp简易实现相关推荐

r.js压缩angular项目，Angular+requirejs+rjs实现初始化http请求数的优化
先看一下我整个项目的文件目录截图(dist文件夹是项目压缩后的文件) 1.正常情况下,仅仅使用angular+require,初次访问index.html,浏览器会加载: main.js里面配置的re ...
Homebrew详解
Homebrew是Mac下得套件管理器,类似于Linux系统中的 yum 或者 apt-get ,它能让你的Mac更完美.mongodb则是NOSQL数据库,一种文档数据库,不同于传统的关系型数据库( ...
Github连击200天(1)——ShowCase
今天是我连续泡在Github上的第200天,也是蛮高兴的,终于达了: 故事的背影是: 去年国庆完后要去印度接受毕业生培训--就是那个神奇的国度.但是在去之前已经在项目待了九个多月,项目上的挑战越来越少 ...
基于Gulp的简易前端自动化工程搭建
上个月月底在公司提出关于前后端分离的想法,并且开始研究关于前后端分离,前端工程化,模块化的一些东西,上周开始我准备自己开始写基于Gulp流的前端工程文件,这两天有时间,着手开始实现这个想法,但是写的过 ...
gulp + angular + requirejs 简单学习
一.安装gulp(已经安装了node环境) npm install -g gulp 二.在package.json文件中配置依赖插件 {"name": "xxxx&qu ...
【开源】分享一个前后端分离方案-前端angularjs+requirejs+dhtmlx 后端asp.net webapi
一.前言半年前左右折腾了一个前后端分离的架子,这几天才想起来翻出来分享给大家.关于前后端分离这个话题大家也谈了很久了,希望我这个实践能对大家有点点帮助,演示和源码都贴在后面. 二.技术架构这两年a ...
javascript 异步模块加载简易实现
在javascript是没有类似java或其他语言的模块概念的,因此也不可能通过import或using等关键字来引用模块,这样造成了复杂项目中前端代码混乱,变量互相影响等. 因此在复杂项目中引入AM ...
gulp + webpack 构建多页面前端项目
修改增加了demo地址 gulp-webpack-demo 之前在使用gulp和webpack对项目进行构建的时候遇到了一些问题,最终算是搭建了一套比较完整的解决方案,接下来这篇文章以一个实际项目为例 ...
[转帖]2019 简易Web开发指南
2019 简易Web开发指南 2019年即将到来,各位同学2018年辛苦了. 不管大家2018年过的怎么样,2019年还是要继续加油的! 在此我整理了个人认为在2019仍是或者将成为主流的技术与大家分 ...

requireJS,rjs,gulp简易实现

requireJS,rjs,gulp简易实现相关推荐

最新文章

热门文章