webpack 基础到构建（二）

六，webpack打包其他资源
    ---这里的其他资源指示为：无需plugin处理，直接输出到指定输出文件；如字体图标；
    ---loader需要 file-loader

    6.1 引入下载好的字体图标【入口文件import引入字体css】，以及在src下的html文件使用字体图标【这里自行阿里图标库下载吧】；
    6.2 webpack 配置

通过排除设置loader，上述中要加入所有其他的资源， 如之前处理的less和图片

打包运行后，将在dist上获取的到字体文件的相关svg，eot等；这里也可以使用options设置生成文件名的长度；

7，webpack -- devServer 配置
    ---上述的流程都无法完成自动，当新增代码时，都需要重新构建运行打包命令
    ---so... devServer自动化【包括自动编译打包、自动打开浏览器等】
    ---包需求： webpack-dev-server   [npm i webpack-dev-server -D]

    7.1 webpack 配置

devServer配置

    配置完成后，打包。此时不再直接运行html文件，改用npx webpack-dev-server，注意：这里是npx！！！
    好了，这时就会产生惊喜，发现提示 Error: Cannot find module 'webpack-cli/bin/config-yargs'；这是版本问题，那么下调webpack-cli版本到3.3.12【npm i webpack-cli@3.3.12 -D】，为什么是这个版本，工程科不必深究；
    再次启动，会发现自动打开了浏览器【地址：http://localhost:3000】，而且，此时修改src下的html文件，浏览器自动刷新；

这里已经将基本的配置已经全部完成， 实话说，这里本来要介绍将打包后的分类文件夹整理下的，但是我设置options->outputPath的时候， 更换了好的版本都没有通过，so，这里就先这样吧。

接下来将重新设置开发环境的webpack项目；包括资源的压缩，兼容处理，懒加载。性能优化等，明天继续。