browserify

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());

整体目录结构:

发布了224 篇原创文章 · 获赞 36 · 访问量 5万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 书香水墨 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览