Ionic 3无法合并Dex：新增页面后构建失败求助

我之前在维护Ionic 3项目的时候也碰到过一模一样的Dex合并失败问题，尤其是加了新页面之后，给你几个亲测有效的排查和解决步骤：

1. 排查重复依赖或版本冲突 #

新增页面时很可能不小心引入了重复插件，或者依赖库版本和现有项目不兼容：

• 先运行 ionic cordova plugin list 查看所有已安装插件，检查有没有重复安装的同类型插件（比如不同版本的同一个Native插件）
• 打开 package.json 核对@ionic-native/*系列依赖，Ionic 3只兼容4.x版本的@ionic-native，别误装了5+版本
• 彻底清理依赖缓存：删除node_modules、package-lock.json，然后执行 npm cache clean --force 和 npm install

2. 启用MultiDex支持 #

这是Dex合并问题最常见的解决办法——新增页面可能让项目方法数超出Android默认Dex限制：

• 打开platforms/android/app/build.gradle，在defaultConfig区块添加：

  multiDexEnabled true
  

• 接着在dependencies区块添加MultiDex依赖：

  implementation 'com.android.support:multidex:1.0.3'
  

• 如果项目没有自定义Application类，就在AndroidManifest.xml的<application>标签里加上：android:name="android.support.multidex.MultiDexApplication"

3. 执行更彻底的构建清理 #

你试过基础的清理，但可以试试更深度的操作：

• 运行 ionic cordova build android --clean 强制清理构建缓存
• 手动删除platforms/android/.gradle、platforms/android/app/build文件夹，再重新执行构建
• 用Android Studio打开platforms/android项目，点击Build -> Clean Project，再Build -> Rebuild Project，IDE的清理有时候比命令行更彻底

4. 检查新增页面的代码问题 #

新增页面的隐藏错误也可能触发奇怪的Dex合并失败：

• 排查新增页面有没有引入体积过大的第三方库，或者重复导入同一个类
• 检查页面的@Component装饰器里的templateUrl/styleUrl路径是否正确，这类路径错误有时候会触发连锁构建问题
• 如果页面用到了第三方插件，确认插件版本和Ionic 3兼容

5. 降级Android构建工具版本 #

如果项目自动升级了构建工具，可能和Ionic 3不兼容：

• 打开platforms/android/build.gradle，把com.android.tools.build:gradle版本降到3.2.1（Ionic 3最稳定的适配版本）：

  dependencies {
      classpath 'com.android.tools.build:gradle:3.2.1'
  }
  

• 同时修改gradle-wrapper.properties里的gradle版本为4.6：

  distributionUrl=https\://services.gradle.org/distributions/gradle-4.6-all.zip
  

提示：每次修改gradle配置后，建议先执行 ionic cordova platform rm android 再重新添加平台 ionic cordova platform add android，确保配置完全生效。

内容的提问来源于stack exchange，提问作者Umar Bilal