使用webpack打包js，并使用UglifyJsPlugin插件进行压缩js代码，用起来确实很方便。然而代码都打包压缩好后，放到ie8中测试页面功能不正常，打开控制台没发现有js报错，IE9中测试时OK的。取消uglify压缩代码在IE8中再测试是正常的，因此基本上可以确定问题是出在uglify压缩这里。

虽然知道了问题的所在，但找出问题并非易事。所以我直接将webpack升到2.0版本进行打包压缩，问题还是没解决（后来从GitHub上了解到webpack2.0不支持ie8，醉了，又降回了1.x版本）。

最后根据功能的不正常一步一步排查问题，初看压缩后的代码，可能跟我的写法相关，因为看到压缩后的变量有被覆盖，所以尝试修改代码的写法，最后还是解决了。

前几年火爆的seajs如今慢慢的要被淘汰了，随着webpack出来后，seajs和requirejs都逐渐的被取代了。 最近一个老的项目要增加一个比较复杂的功能，如果按照以前的写法，这个功能写完后这个js文件应该有过千行代码（曾经很以为荣的写过千行代码的js文件，现在回头看看就是挖坑）。为了使代码更容易阅读，就用上了webpack。 由于项目是前两年用seajs写的，那么打包出来的内容必须是这样的：

define(function(require,exports,module){
    /// ... 代码
});

在前端项目开发时，本地启动项目可能使用的地址localhost+端口，然后后端给出的api接口可能是外网的地址（例如dev.api.com），前端直接使用可能会存在跨域问题，解决方法有两种：一种是后端直接设置允许跨域，另一种是做反向代理。 前端做反向代理可以使用NGINX，也可以使用webpack-dev-server。使用webpack-dev-server做代理的配置如下：

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://dev.api.com',
        pathRewrite: {'^/api' : ''}
      }
    }
  }
}

现在前端生产环境的代码基本上是压缩的，如果需要知道压缩代码报错对应的源码位置，我们可以通过sourcemap文件去实现。但对于前端而言，如果把sourcemap放出来，差不多相当于把源码暴露出来了。为了解决这个问题，我把sourcemap文件放到服务端，然后将浏览器的报错发送到服务端由服务端根据错误信息去定位源码所在位置。以前用过Sentry，好像是支持的，但我还有一些其他额外的需求，所以我就造了个简易的轮子。

现在很多项目都使用了第三方UI组件库，如： Element UI 、 Ant Design Vue 、 View UI 、 Vuetify 等等。引入的方式分为 完整引入 和 按需引入 两种方式。