资讯专栏INFORMATION COLUMN

vue-cli 使用 webpack-bundle-analyzer

bingchen / 434人阅读

摘要:才来公司,填坑。然后发现项目打包越来越大。然后就满世界找解决方法。网上看到这个神器。然后我配置完毕各种报错。然后去看的官方文档。然后找到然后再看文档。看这段不用配置任何,在的时候添加参数就好啦。然后运行一下,浏览器访问。

浪费几多时间。 才来公司,填坑。然后发现项目打包越来越大。然后就满世界找解决方法。网上看到 webpack-bundle-analyzer 这个神器。然后各种说配置 package.json 文件。然后我配置完毕各种报错。

折腾一番,感觉玩不下去了。然后去看 vue-cli 的官方文档。然后找到 vuejs-templates/webpack 然后再看文档。我能说啥。看这段:

# build for production and view the bundle analyzer report
npm run build --report

不用配置任何 script ,在 build 的时候添加参数 就好啦。然后运行一下,浏览器访问 http://127.0.0.1:8888

然后开始填坑。。。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/90510.html

相关文章

  • webpack的可视化资源分析工具webpack-bundle-analyzer使用

    摘要:随着项目越来约庞大,导致构建包的时候速度缓慢首先推荐使用的可视化资源分析工具。拉拉拉拉拉开心浏览器打开分析结果,大概长这个样子哟分析结果出来了,接下来就可以开始优化啦 随着项目越来约庞大,导致构建包的时候速度缓慢! 首先推荐使用wepback的可视化资源分析工具。以下给出webpack-bundle-analyzer配置【vue-cli构建项目时会自动配置好】 安装webpack-b...

    xiaowugui666 评论0 收藏0
  • vue-cli项目优化,缩短首屏加载时间

    摘要:主要是首屏加载太慢。文件按需加载如果没有这个设置,项目首屏加载时会加载整个网站所有的文件,所以将文件拆开,点击某个页面时再加载该页面的是一个很好的优化方法。在中,不要使用的方法引入组件,使用。使用插件,将的值改成。 主要是首屏加载太慢。 大文件定位我们可以使用webpack可视化插件Webpack Bundle Analyzer 查看工程js文件大小,然后有目的的解决过大的js文件。 ...

    lufficc 评论0 收藏0
  • vue-cli项目优化,缩短首屏加载时间

    摘要:主要是首屏加载太慢。文件按需加载如果没有这个设置,项目首屏加载时会加载整个网站所有的文件,所以将文件拆开,点击某个页面时再加载该页面的是一个很好的优化方法。在中,不要使用的方法引入组件,使用。使用插件,将的值改成。 主要是首屏加载太慢。 大文件定位我们可以使用webpack可视化插件Webpack Bundle Analyzer 查看工程js文件大小,然后有目的的解决过大的js文件。 ...

    hedzr 评论0 收藏0
  • vue-cli3 搭建的前端项目基础模板

    摘要:基于搭建的前端模板,本仓库,即可搭建完成一个新项目的基础模板,源码地址,欢迎或特性预编译语言,做了一定的封装,详见雪碧图移动的适配方案引入了及,可以自由地用去开发常用的工具类引用全局注入相关的文件,如通用的及等常用的的集合支持 基于 vue-cli3 搭建的前端模板,clone 本仓库,即可搭建完成一个新项目的基础模板,源码地址,欢迎 star 或 fork 特性 CSS 预编译语言...

    william 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<