uni-app 打包微信小程序时分包里的js文件被错误打包到主包的vendor.js中导致主包过大

在 uni-app 打包微信小程序时，如果分包中的 JS 文件被错误地打包到主包的 vendor.js 中，导致主包过大，可以通过以下几种方式来解决：

1. 检查分包配置

确保 pages.json 中的分包配置正确。分包的路径和文件结构需要与项目目录结构一致。例如：

{
  "pages": [
    {
      "path": "pages/index/index",
      "style": {
        "navigationBarTitleText": "首页"
      }
    }
  ],
  "subPackages": [
    {
      "root": "packageA",
      "pages": [
        {
          "path": "pageA",
          "style": {
            "navigationBarTitleText": "分包A"
          }
        }
      ]
    }
  ]
}

2. 手动配置分包

如果自动分包不满足需求，可以手动配置分包路径。确保分包中的 JS 文件没有被错误地引用到主包中。

3. 使用 webpack 配置

在 vue.config.js 中通过 webpack 配置来优化打包行为，避免将分包的 JS 文件打包到主包中。例如：

const path = require('path');

module.exports = {
  configureWebpack: {
    optimization: {
      splitChunks: {
        cacheGroups: {
          vendor: {
            test: /[\\/]node_modules[\\/]/,
            name: 'vendor',
            chunks: 'all',
          },
          common: {
            name: 'common',
            minChunks: 2,
            chunks: 'all',
            priority: -20,
            reuseExistingChunk: true,
          },
        },
      },
    },
  },
};

4. 检查依赖引用

检查项目中是否有在分包的 JS 文件中引用了主包的依赖，或者是否有在主包中引用了分包的依赖。确保依赖引用正确。

5. 使用 uni-app 提供的分包优化工具

uni-app 提供了一些分包优化的工具和方法，可以参考官方文档进行配置和优化。

6. 检查 manifest.json 配置

确保 manifest.json 中的配置没有错误，特别是关于分包的部分。

7. 使用 webpack-bundle-analyzer 分析打包结果

使用 webpack-bundle-analyzer 来分析打包结果，查看哪些文件被打包到了 vendor.js 中，并根据分析结果进行优化。

npm install webpack-bundle-analyzer --save-dev

在 vue.config.js 中配置：

const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

module.exports = {
  configureWebpack: {
    plugins: [
      new BundleAnalyzerPlugin()
    ]
  }
};

8. 清理缓存

有时候打包结果可能受到缓存的影响，可以尝试清理 node_modules 和 dist 目录，然后重新打包。

rm -rf node_modules
rm -rf dist
npm install
npm run build