在这里，请先看基础文章与相关技术文档：
- 安装：
npm initnpm install requirejs --savenpm install jquery@1.11.1 --save创建基本目录：js/main.js&test.jscss/index.cssindex.htmlbuild.jscopy requirejs目录下的r.js到根目录创建导出目录：one测试目录创建完成！
- index.html
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<link rel="stylesheet" href="css/index.css"></head><body><iframe class="iframe" src="http://baidu.com" frameborder="0" height="300"></iframe><script type="text/javascript" defer anync="true" src="node_modules/requirejs/require.js" data-main="js/main"></script></body></html>
- build.js
//参考配置目录 ?http://www.yfznw.com/node/22
({ ???dir:‘./one‘,//输出路径 ???paths:{ ???????jquery:‘node_modules/jquery/dist/jquery.min‘, ???????test:‘js/test‘, ???????index:‘css/index.css‘ ???}, ???name: ‘js/main‘,// 模块入口 ???optimize: ‘none‘,//是否压缩 默认是压缩的，去掉不要就是压缩}) - main.js
require.config({ ???baseUrl:‘node_modules/‘, ???paths:{ ???????‘jquery‘:‘jquery/dist/jquery.min‘, ???????‘js‘:‘../js‘ ???}});require([‘jquery‘,‘js/test‘],function($,test) { ???console.log($); ???test.one();}); - test.js
define([],function() { ??var testing = {}; ??testing.one = function() { ??????console.log(‘module testing‘); ??}; ???return testing}); - index.css (主要只是存在而己，设定了流动条样式)
@charset "utf-8";*::-webkit-scrollbar{width:2px;height:12px;}*::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment{width:0;height:0;}*::-webkit-scrollbar-button:vertical:increment{background:transparent;}*::-webkit-scrollbar-track-piece:vertical{background:#DFE7EF;}*::-webkit-scrollbar-track-piece:vertical:hover{background:#DFE7EF;}*::-webkit-scrollbar-track-piece:horizontal{background-color:transparent;}*::-webkit-scrollbar-thumb:vertical{height:100px;background:rgba(110,146,182,.5);}*::-webkit-scrollbar-thumb:vertical:hover{background:rgba(110,146,182,.4);}*::-webkit-scrollbar-thumb:horizontal{width:80px;height:10px;background-color:#ccc;} - 目录截图
- 生成r.js打包目录
//切换到根目录执行：node r.js -o build.js
- 效果：
新目录one就是一个新的站点，那么流程到此结束；可看到与未打包时一样的结果；但是，相对而言请求被打包了，文件被打包了，那么还有更多 的细节，请查看官方文档 ；
requirejs 使用实例r.js打包
原文地址：http://www.cnblogs.com/q1104460935/p/7998335.html