分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > IT知识

定位webpack文件大小

发布时间:2023-09-06 01:14责任编辑:苏小强关键词:webpack

之前发现一个神器,记录一下,可以可视化webpack打包的每个js文件大小,这样对我们优化代码是有帮助的,有目标的

https://www.npmjs.com/package/webpack-bundle-analyzer

这是wbpack-bundle-analyzer这个工具的地址

1、在package.json加入这行命令  “analyz”: “NODE_ENV=production npm_config_report=true npm run build”

2、安装webpack-bundle-analyzer ?cnpm install --save-dev webpack-bundle-analyzer

3、在webpack.config.js里增加如下代码

 

var BundleAnalyzerPlugin = require(‘webpack-bundle-analyzer‘).BundleAnalyzerPlugin;

// ...

plugins: [new BundleAnalyzerPlugin()]

// ...

 

4、运行analyz ?npm run analyz 默认会打开 http://127.0.0.1:8888 作为展示

定位webpack文件大小

原文地址:http://www.cnblogs.com/wzndkj/p/7609002.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved