webpack打包提交代码

①项目发布

npm run build

或者npm run build--report

会打开浏览器显示包目录的分析图(就是那个文件大或者小)

在confug下的undex.js 的build 里最后一行

 

开启GZip压缩

但是压缩后体积还是大 可以为web服务器开启GZip压缩(Apache、IIS、Tomcat、Node服务器)
如果不启用GZip压缩,那么,服务器上文件的真实大小,,就是网络传输中,真实传输的大小

如果服务器,启用GZip压缩,则 文件在网络中,传输的时候,会被压缩,经过Gzip的压缩之后,文件体积会大约减小到之前的四分之一

 

在build下的webpack.prod.conf.js文件中添加一个与module、output 平级的externals: {},

externals 意思是把项目中,一些体积比较大的包,抽离为 外部加载的方式(link的方式)

  // 把项目中，一些体积比较大的包，抽离为 外部加载的方式
  externals: {
    // 包名: '构造函数'
    vue: 'Vue', // vue
    'vue-router': 'VueRouter', // 路由
    axios: 'axios',
    lodash: '_',
    nprogress: 'NProgress',
    echarts: 'echarts'
  },

npm i compression -S

在

②