您的位置:首页 > 其它

Browserify入门

2016-09-07 15:10 162 查看
1.Browserify是什么?

“Browserify lets you require(‘modules’) in the browser by bundling up all of your dependencies.” - Browserify.org

出自官网的一句话。用通俗的话讲就是:browserify 是一个浏览器端代码模块化工具,可以处理模块之间的依赖关系,让服务器端的 CommonJS 格式的模块可以运行在浏览器端。

2.我们用Browserify来做什么

Browserify的原理:处理代码依赖,将模块打包到一起,实现压缩合并代码。 Browserify 可以让你使用类似于 node 的

require() 的方式来组织浏览器端的 Javascript 代码,通过预编译让前端 Javascript 可以直接使用 Node

NPM 安装的一些库。

3.安装

npm install -g browserify


4.示例

main.js 的内容,像普通的 nodejs 程序那样使用 require() 加载库和文件。

var foo = require('./foo.js');
var bar = require('../lib/bar.js');

var cal = function() {
return foo(100) + bar('baz');
}


导出的方法:

module.exports = cal;


使用 browserify 编译:

browserify main.js > bundle.js


现在 main.js 需要的所有其它文件都会被编译进 bundle.js 中,包括很多层 require() 的情况也会一起被递归式的编译过来。编译好的 js 可以直接拿到浏览器使用

<script src="bundle.js"></script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  Browserify