[Node.js] Broswerify -- 1
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:
[Node.js] Broswerify -- 1的更多相关文章
- [Node.js] Broswerify -- 2
Browserify allows you to leverage 10s of thousands of javascript modules available in the Node Packa ...
- node.js学习(三)简单的node程序&&模块简单使用&&commonJS规范&&深入理解模块原理
一.一个简单的node程序 1.新建一个txt文件 2.修改后缀 修改之后会弹出这个,点击"是" 3.运行test.js 源文件 使用node.js运行之后的. 如果该路径下没有该 ...
- 利用Node.js的Net模块实现一个命令行多人聊天室
1.net模块基本API 要使用Node.js的net模块实现一个命令行聊天室,就必须先了解NET模块的API使用.NET模块API分为两大类:Server和Socket类.工厂方法. Server类 ...
- Node.js:进程、子进程与cluster多核处理模块
1.process对象 process对象就是处理与进程相关信息的全局对象,不需要require引用,且是EventEmitter的实例. 获取进程信息 process对象提供了很多的API来获取当前 ...
- Node.js:理解stream
Stream在node.js中是一个抽象的接口,基于EventEmitter,也是一种Buffer的高级封装,用来处理流数据.流模块便是提供各种API让我们可以很简单的使用Stream. 流分为四种类 ...
- Node.js:Buffer浅谈
Javascript在客户端对于unicode编码的数据操作支持非常友好,但是对二进制数据的处理就不尽人意.Node.js为了能够处理二进制数据或非unicode编码的数据,便设计了Buffer类,该 ...
- node.js学习(二)--Node.js控制台(REPL)&&Node.js的基础和语法
1.1.2 Node.js控制台(REPL) Node.js也有自己的虚拟的运行环境:REPL. 我们可以使用它来执行任何的Node.js或者javascript代码.还可以引入模块和使用文件系统. ...
- Node.js npm 详解
一.npm简介 安装npm请阅读我之前的文章Hello Node中npm安装那一部分,不过只介绍了linux平台,如果是其它平台,有前辈写了更加详细的介绍. npm的全称:Node Package M ...
- Node.js入门(一)
一.Node.js本质上是js的运行环境. 二.可以解析js代码(没有浏览器安全级的限制): 提供系统级的API:1.文件的读写 2.进程的管理 3.网络通信 三.可以关注的四个网站: 1.https ...
随机推荐
- unity3d Human skin real time rendering 真实模拟人皮实时渲染(转)
先放出结果图片...由于网上下的模型是拼的,所以眼皮,脸颊,嘴唇看起来像 存在裂痕,解决方式是加入曲面细分和置换贴图 进行一定隆起,但是博主试了一下fragment shader的曲面细分,虽然细分成 ...
- python中的深拷贝与浅拷贝
深拷贝和浅拷贝 浅拷贝的时候,修改原来的对象,浅拷贝的对象不会发生改变. 1.对象的赋值 对象的赋值实际上是对象之间的引用:当创建一个对象,然后将这个对象赋值给另外一个变量的时候,python并没有拷 ...
- vim中编码方式---不完整总结
关于编码,总有很多故事,这里只是记录下暂时的东西. 1.关于查看文件的编码 在查看文件编码的时候,总是倾向于使用file来进行查看,然而使用file命令的时候,并没有什么卵用: 在查看细节的时候,可以 ...
- 上海洋码头(www.ymatou.com)急招技术人才(职位:互联网软件开发工程师,.NET网站架构师,Web前端开发工程师,高级测试工程师,产品经理)
对公司招聘职位有兴趣的童鞋可以把简历发送到zhangzhiqiang@ymatou.com,我们HR会快速给你答复. 互联网软件开发工程师 岗位职责: 1.参与洋码头各个平台(www.ymatou.c ...
- Linux_系统信息
公司里一些仿真软件得进Linux系统,好奇公司用的什么Linux版本,于是搜罗了几个命令如下: 1 uname - Print system info -a, print all info -s, ...
- Ubuntu之系统交换分区Swap增加与优化
http://os.51cto.com/art/201212/372860.htm http://blog.csdn.net/xingyu15/article/details/5570225 ...
- C# JackLib系列之GdiHelper圆角矩形的快速生成
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.D ...
- android ViewConfiguration
ViewConfiguration 1.有时候要获取一些android UI的中一些默认参数的来进行操作设置,就要用到ViewConfiguration 官方飞解释是:ViewConfiguratio ...
- OC键值观察KVO
什么是KVO? 什么是KVO?KVO是Key-Value Observing的简称,翻译成中文就是键值观察.这是iOS支持的一种机制,用来做什么呢?我们在开发应用时经常需要进行通信,比如一个model ...
- 一个优秀windows C++程序员的知识体系[转]
转自:一个优秀windows C++程序员的知识体系 思考一个优秀windows C++ 程序员该有哪些知识,可最终发现什么知识都不能少, 看下图: 除了上面知识,程序员还要不断学习, 保持对新知识的 ...