10分钟搞定webpack打包

入门前端这个职位近三年的时间了，可是脑子里的东西很少也很多，今天就从脑壳里把新版本的webpack打包过程拔出来给你们鲁一遍，就算帮助那些小白了，废话很少说，开始鲁起来，你们跟着我一块儿撸。。。

首先，去官网下载node.js  地址本身找度娘去，别那么懒！！！

 

 

一，咱们在合适的位置建立一个文件夹，好比桌面，命名webapp，而后进入这个文件夹按着shift+鼠标右键，点击  “在此处打开命令窗口”

      初始化项目，输入：

      npm init

      一路按enter键便可

      

二， 接下来安装webpack

       （1） 全局安装webpack ，咱们在命令行输入： npm install -g webpack

  （2） 一般咱们会将webpack安装到项目依赖，这样就能够使用本地版本的webpack，咱们在命令行输入： npm install webpack --save-dev

三，安装 webpack-cli 

 npm install -g webpack-cli 

四 ,设置模式
 
 webpack --mode development

五，建立入口文件

 根目录下建立src,并添加入口index.js文件，必须命名index.js，否侧会报错

六，配置
 咱们在package.json中scripts中加入两个成员：
package.jsonscripts

 "dev":"webpack --mode development", "build":"webpack --mode production"


 全局安装webpack-cli
 npm -i webpack-cli -g  或者 npm install webpack-cli 

 本地安装：

  npm install webpack -D七 ， 打包    npm run build    //接着输入 webpack-cli 或者 webpack-command 便可    在项目中是否是生成了dist/main.js    将文件引入index。html看看效果吧