每天一点面试题（18）------首屏加载时间的优化策略

1、尽可能的缩小webpack或者其他打包工具生成的包的大小

为了做到这一点，需要做到尽可能的减少生产环境下依赖的库数量，尽可能的按需引用，减少无用代码占的空间。
我刚开始优化的时候，就不知道从何处优化起，而且根本不知道生成的包中哪个依赖占据着空间，我还一度挨个删去库引用，来看哪个库占用的空间最多。 后来才知道有名叫：webpack-bundle-analyzer的分析工具，接下来我顺带总结一下这个包的使用姿势。
: 首先

npm install --save-dev webpack-bundle-analyzer

然后在webpack.prod.conf.js中配置：

const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
plugins: [
new BundleAnalyzerPlugin(
     {
   
          analyzerMode: 'server',
          analyzerHost: '127.0.0.1',
          analyzerPort: 8888, // 运行后的端口号
          reportFilename: 'report.html',
          defaultSizes: 'parsed',
          openAnalyzer: true,
          generateStatsFile: false,
          statsFilename: 'stats.json',
          statsOptions: null,
          logLevel: 'info'
        }