为什么要用webpack呢
首先肯定遇到问题,才不得不用的嘞,目前基于ES6的模块化,浏览器暂不支持;ES6的语法,浏览器并不完全支持,所以我们必须用webpack做打包,用babel做转义(ES6转义成ES5),然后我们前端又有想 压缩代码 整合代码 以让网页加载更快的需求,然后这里面可能还涉及缓存的问题,而webpack如果做的好的话,会让代码更多的能命中缓存
首先你的安装node,安装好之后打开node命令行(按住shift键+鼠标右击选择在此处打开命令窗口)
输入
node -v
可以查看你安装的node版本号 就说明你已经成功安装了node
在开始安装webpack之前,我建议大家先安装一下淘宝镜像的cnpm,因为npm安装实在是太慢了,太卡了,几乎都不动的样子,cnpm毕竟国内的服务器,相对来说还是比较快的
命令如下
npm install cnpm -g --registry=https://registry.npm.taobao.org
安装好之后 以下所有的npm 都是可以换成cnpm 去执行命令
1-----------------
首先创建一个新的文件夹命名为webpack-demo,然后在此文件下再次打开命令窗口
npm init -y //为了初始化npm环境
以上命令执行完毕之后
你会发现你的文件下自动创建了一个package.json的文件,先不用管这个文件干啥的
-----------------
然后就该安装webpack了,命令如下
npm install webpack webpack-cli -D
命令执行成功之后自动生成node-modules
那个package.js文件中多了两行 关于webpack的信息
"devDependencies": {
"webpack": "^4.43.0",
"webpack-cli": "^3.3.11"
}
2-----------------
当前目录下手动创建文件src,在src下创建index.js,打印点内容
src/index.js 写点内容console.log("this is index js")
来来来 重点了,干货需要自己手动 手动 手动创建
手动创建webpack.config.js