提拔开辟服从的5个webpack插件

打印 上一主题 下一主题

主题 690|帖子 690|积分 2070


  • Vue-lazyload   图片懒加载插件:vue-lazyload
  • Image-webpack-loader   图片压缩插件:image-webpack-loader,npm install image-webpack-loader,在vue.config.js中设置,设置压缩比率,如0.7
Config.module
  .rule(‘images’)
  .use(‘image-webpack-loader’)
  .loader(‘image-webpack-loader’)
3,  sprites  精灵图自动合成插件:sprites, 安装sprites插件, 1:设置中添加 精灵图地点,2,在代码中直接引用图片,例:‘assets/images/sprites/logo.png’
4,  px转rem   自顺应屏幕。Viewport插件:
5,remove-console   生成环境中控制台不打印console.log
   安装 remove-console插件
   在设置里设置,假如是生成环境则使用去掉console的插件
另外,productionSourceMap:false   生产环境调试工具source-map
   因生产环境代码被压缩,转译。而source map是将编译,打包后的代码映射回源代码的过程。
   Sourcemap配合chrome可以提供一个debug线上项目标功能。只在打开控制台时才加载。
   设置中: productionSourceMap:false
   打开控制台右击add source map,出现webpack://,就可以调试对应的源码。

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

羊蹓狼

金牌会员
这个人很懒什么都没写!

标签云

快速回复 返回顶部 返回列表