码迷,mamicode.com
首页 > Web开发 > 详细

[Node.js] Broswerify -- 1

时间:2014-12-10 21:13:33      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   io   ar   color   os   sp   for   

Browserify is a tool that brings node.js style development to the browser.

The thing you can see on the node.js cmd line can also be broung up to the broswer.

What you need to do is:

Install the browserify:

npm install -g browserify

 

Now, for example, you have two javascript file:

entry.js:

/**
 * Created by Answer1215 on 12/10/2014.
 */
var test = require(‘./test‘);

console.log(test);

test.js:

/**
 * Created by Answer1215 on 12/10/2014.
 */
module.exports = [‘foo‘, ‘bar‘, ‘tool‘];

When you run in the commond line: npm entry.js

you will get the result:

C:\Users\Answer1215\WebstormProjects\angular\commonJSBroswerfiy>node entry
[ foo, bar, tool ]

 

But if you run browserfiy:

browserfiy entry.js -o bundle.js

It will create a new file which called bundle.js which minfiy the code, it looks like:

(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module ‘"+o+"‘");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
/**
 * Created by Answer1215 on 12/10/2014.
 */
var test = require(‘./test‘);

console.log(test);
},{"./test":2}],2:[function(require,module,exports){
/**
 * Created by Answer1215 on 12/10/2014.
 */
module.exports = [‘foo‘, ‘bar‘, ‘tool‘];
},{}]},{},[1]);

 

 Then you can create an html file whcih inclide the bundle.js:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<script src="bundle.js"></script>
</body>
</html>

Check in the broswer:

bubuko.com,布布扣

 

[Node.js] Broswerify -- 1

标签:style   blog   http   io   ar   color   os   sp   for   

原文地址:http://www.cnblogs.com/Answer1215/p/4156255.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!