CommonJS
2019-03-14 本文已影响0人
fb941c99409d
commonJS 是 node端的引入模块方案
浏览器端实现commonJS步骤
开发环境使用commonjs编码, 然后使用Browserify对文件进行编译(生成require函数,然后合并资源文件为一个js),使其可以在浏览器运行
## Browserify模块化使用教程
1. 创建项目结构
|-js
|-dist //打包生成文件的目录
|-src //源码所在的目录
|-module1.js
|-module2.js
|-module3.js
|-app.js //应用主源文件
|-index.html
|-package.json // 可以用 npm init初始化项目生成package.json
{
"name": "browserify-test",
"version": "1.0.0"
}
2. 下载browserify 必须全局和局部都安装
* 全局: npm install browserify -g
* 局部: npm install browserify --save-dev
3. 定义模块代码
* module1.js
* module2.js
* module3.js
* app.js (应用的主js)
//引用模块
let module1 = require('./module1')
let module2 = require('./module2')
let module3 = require('./module3')
//使用模块
module1.foo()
module2()
module3.foo()
module3.bar()
* 打包处理js:
* browserify js/src/app.js -o"代表out的意思" js/dist/bundle.js
* 页面使用引入:
<script type="text/javascript" src="js/dist/bundle.js"></script>