本节知识点:
1.速度了解CommonJS
2.安装webpack
3.编译我们的JS
1.CommonJS是一个规范(http://commonjs.org)
譬如:一个单独的文件就是一个模块.使用require来加载模块,返回文件内部的exports对象
大家看是否和NodeJS的写法很像?确实,NodeJS实现并推动了这个规范(一大部分)
有了这个规范JS可以在任何地方运行,不只是浏览器中(未来很多只要兼容CommonJS规范的系统都可以用JavaScript来开发)
课后:请大家回去查询其他规范,如AMD、CMD规范等(譬如看下Require.Js,)
遵循这个规范 然后呢?
这时一个前端构建框架–webpack产生了(模块打包)
它能帮我们把本来需要在服务端运行的JS代码,通过模块的引用和依赖打包成前端可用的静态文件
2.安装
npm install -g webpack
设置配置文件
在项目根目录下新建一个webpack.config.js
module.exports=
{
entry:[ //entry是入口文件 可以多个
__dirname+'/sxin.js'
],
output:{
path:__dirname+'/build/js',
filename:'build.js'
}
}
运行webpack
sxin.js
var getlib=require('sxin');
console.log(getlib.age);
alert(getlib.age);
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src="build/js/build.js"></script>
test
</body>
</html>