[Node.js] Broswerify -- 1
2023-09-14 09:00:55 时间
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:
相关文章
- 【nodejs原理&源码赏析(6)】深度剖析cluster模块源码与node.js多进程
- Node.js配合jQuery UI autocomplete的应用
- [Debug] Debug Node.js Application by using Chrome Dev tools
- [Node.js] Node Util Promisify - How to Convert Callback Based APIs to Promise-based
- [Node.js] Broswerify -- 1
- [MEAN Stack] First API -- 1. with Node.js, Express and MongoDB
- [Node.js]22. Level 4: Dependency
- Node.js 和 C++ 之间的类型转换
- [Debug] Debug Node.js Application by using Chrome Dev tools
- [MEAN Stack] First API -- 1. with Node.js, Express and MongoDB
- [Node.js] Level 3 new. Steam
- [Node.js]32. Level 7: Working with Lists -- Redis
- js链式调用
- Atitit sleep原理 node.js sleep解决方案 timer
- Atitit php vs node.js attilax总结
- paip.编程语言方法重载实现的原理及python,php,js中实现方法重载
- 华为OD机试 - Linux发行版的数量(Java & JS & Python)
- 穆客带你快速定位Node.js内存泄露
- js逆向笔记
- mac下使用brew安装node.js环境
- leetcode 415. 字符串相加 js 实现
- js实现深度比较
- js工具类的封装
- Node.js fs模块(三)目录操作
- js金额价格四舍五入保留2位小数demo效果(整理)
- Node.js学习笔记——nvm