webpack基础入门02

此时已经学会webpack打包了

接下来就是学会怎么设置入口和出口，所以首先我们要知道为什么要设置入口和出口。原因是：我们已经知道webpack是打包js文件的。那如果我们要想打包html.css.图片之类的文件怎么办呢？那咱就可以用webpack-cli这个东西了，这个就是一个脚手架。所以得加一些配置文件才可以打包。

操作如下：

第一步：运行命令  cnpm  install  webpack  webpack-cli  -s 

第二步：打开webpack的中文文档。

🔗：https://v4.webpack.docschina.org/concepts/#entry

文档里写到webpack有几个核心概念，分别是：入口，出口，loader，插件，模式，浏览器兼容性这6个模块。

那么问题来了入口是什么呢？

入口起点(entry point)指示 webpack 应该使用哪个模块，来作为构建其内部 依赖图(dependency graph) 的开始。进入入口起点后，webpack 会找出有哪些模块和库是入口起点（直接和间接）依赖的。

默认值是 ./src/index.js，但你可以通过在 webpack configuration 中配置 entry 属性，来指定一个（或多个）不同的入口起点。例如：

 也就是说   咱得在src目录同级外创建一个webpack.config.js

接着把这图里的代码粘过去把entry里面的地址改成./src/index.js就可以啦。

 

接下来 再运行：webpack命令就可以打包成功了。

出口也上面的步骤一样把出口代码粘过来修改一下文件名就可以

比如你把filename:'demo.js' 修改成自己想要的名字都可以的。