- nodejs模块化规范，现在被大量用前端，原因：效率高，简洁
- 前端开发依赖的插件和库，都可以从npm中获取
- 构建工具的高度自动化，使得使用Npm的成本非常低
- commonjs不会异步加载js,而是同步一次性加载出来
使用commonjs
Paste_Image.png
- 需要构建工具支持
- 一般和npm一起使用
AMD和commonjs使用场景
- 需要异步加载，使用AMD
- 使用了npm之后建议使用commonjs
构建工具
grunt
gulp
-
webpack
- pwd 进入当前目录
- ll 查看当前目录
- npm instal http-server -g
- http-server -p 8881(只能浏览静态网页)
-
安装webpack
- npm init
- npm install webpack --save-dev(只用于开发环境)或指定版本npm install --save-dev webpack@2.1.0-beta.25
- 安装jquery
- npm install jquery --save
Paste_Image.png
- 卸载 npm uninstall moment --save
packge.json文件就是包的一个配置，npm把webpack目录当成一个包
--save-dev save是将webpack保存起来 -dev是保存起来后只用于开发环境
- 配置webpack
- webpack.config.js
- index.html中引入bundle.js
sdf
npm start(运行命令，要现在packge.json中配置)
"start": "webpack"
webpack版本的问题
如果webpack使用的1.x的版本，那么webpack-dev-server也要使用1.x的版本，否则会报如下错误：Connot find module 'webpack/bin/config-yargs'。
这时候，应该怎么解决呢？
notice:若报各种模块错误，是webpack版本问题，升级一下就好了
将webpack1升级为webpack2的一些总结
-
使用jquery
var $=require('jquery') var $root=$('#root') $root.html("在app.js入口文件中引用jquery") -
//压缩js webpack.config.js
plugins: [ new webpack.optimize.UglifyJsplugin() ]
