webpack学习之路01

webpack是什么

　　1、模块化 能将css等静态文件模块化

　　　2、借助于插件和加载器

webpack优势是什么

　　1、代码分离 各做各的

　　2、装载器(css,sass,jsx,es6等等)

　　3、智能解析（require(./)）引入

webpack命令：

　　1、npm  install -g webpack 全局安装

　　2、npm init 初始化 （建立package.json）

　　3、webpack 入口文件  （打包）  加上  --watch   实时监听

　　4、使用第三方插件

　　　　　　；例如：项目中使用jq  npm install jquery --save

　　　　　　在页面 require('query')引入即可使用

　　5、模块化静态文件处理

　　　　　　webpack.config.js文件内容  来处理css加载

　　　　　　下载 npm install style-loader css-loader     --save-dev

　　　　　　webpack.config.js文件内容  来处理es6转化

　　　　　　下载 npm install babel-core babel-loader babel-preset-es2015 --save-dev

　　　　　　

　　6、构建项目修改命令

　　　　　　

　　　　　　使用npm install -g webpack-dev-server --save-dev保存进入package.json

　　　　　　　　start配置完成后就可以实现启动服务器   并且配置入口出口文件

　　　　　　　　先使用npm run build 构建项目  在使用npm start 启动服务器