前端项目打包优化

最新推荐文章于 2024-06-19 07:45:00 发布

devnotbug

最新推荐文章于 2024-06-19 07:45:00 发布

阅读量44

点赞数 9

文章标签：前端

本文链接：https://blog.csdn.net/qq_52602294/article/details/138394657

版权

1、分析包的体积

1.1 打包的时候加上--report即可获得打包分析界面；

1.2 webpack-bundle-analyzer 进行打包体积分析；

npm install webpack-bundle-analyzer -D

2、配置

3、运行

4、移除 console

借助插件babel-plugin-transform-remove-console 或者 npm install --save-dev @babel/plugin-transform-runtime

并在babel.config.js中配置该插件只能生产阶段生效

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['@babel/preset-env'],
    plugins: [
      [
        '@babel/plugin-transform-runtime',
        {
          corejs: 3,
          helpers: true,
          regenerator: true,
          useESModules: false,
        },
      ],
    ],
  };
};