browserify官方传送门: http://browserify.org/
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
</body>
<script src="./bundle.js"></script>
<script>
/*
browserify:
浏览器没有定义require方法,但是Node.js有。
使用Browserify可以编写使用require的代码,
就像在Node中使用它一样。
命令行安装(全局):
npm install -g browserify
现在递归地捆绑了所有起始于需要的模块main.js到
一个文件名为bundle.js与browserify命令:
browserify main.js -o bundle.js
注意:main.js是所有的js页面都引入到了里面。
*/
</script>
</html>
m1.js:
module.exports = {
name: "xyz-m1",
foo: function () {
return this.name;
}
}
m2.js:
module.exports = function () {
return "xyz-m2";
}
m3.js:
// var exports = module.exports;默认就存在的
exports.foo = function () {
return "xyz-m3";
}
app.js:(m1.js、m2.js、m3.js都引入到了app.js)
var m1 = require("./modules/m1");
var m2 = require("./modules/m2");
var m3 = require("./modules/m3");
console.log(m1.foo(),m2(),m3.foo());
整体目录结构: