webpack的初步使用

对于前端来说，学习一个打包器是非常有必要的，而目前来说webpack就是最好的选择之一，接下来让我们来看看如何使用

1.安装node.js和npm
可以通过node -v，npm -v来查看版本

2.初始化项目
在项目目录里cmd输入npm init -y，初始化成功的话我们的项目目录里会出现一个package.json文件，代码如下

3.接下来就可以开始安装webpack了

这里不推荐全局安装
npm install --global webpack

而是推荐这种（接下来默认在项目目录）
cmd里输入指令npm install --save-dev webpack

当然，webpack4+版本还要安装webpack-cli
cmd里输入指令npm install --save-dev webpack-cli

这样的话webpack就安装成功了

4.接下来我们就可以对webpack进行配置
不推荐直接用命令行使用webpack，容易出错，在这我们使用配置文件
在项目目录里创建webpack.config.js文件，基本格式如下
这里面有entry（入口）和output（出口）两个属性，分别有什么作用呢，很明显，entry指的就是我们要让webpack以哪个文件作为入口，而output这段函数的含义是它会根据我们的代码去进行打包等一系列操作，最终在dist目录下生成一个bundle.js文件，而这个文件是我们可以直接在index.html里直接引入使用的

5.ok，webpack配置文件配置完成，接下来我们就应该让webpack来编译我们的项目了（默认你们的index.html和index.js有自己输入的代码），那应该怎么使用呢，首先，我们在package.json文件里输入这么一段代码
没错，就是第二行里那段，ok，接下来我们就可以在命令行终端里输入npm run start，
终端显示类似如下

ok，这时我们的项目里就会生成一个bundle.js文件，我们用script标签把它引入到index.html里

然后就可以看到我们想要的效果了！

当然，这只是最基础的效果，webpack有更复杂的使用方法我们都可以在官方文档里看到，或许我有时间还会继续写，感兴趣的coder也可以自己去文档看一下，非常有好处~

注：在webpack里，我们的导入使用的是import，比如呢，我们先安装一个jquery
npm install jquery --save
然后我们在js文件引入
import $ from ‘jquery’
这样我们就可以使用了，个人感觉非常的好用~

就这样了，说的不好的地方还请见谅~