angular - 元数据版本不匹配在条形码扫描仪中发现版本 4，预期为 3
问题描述
目前我正在使用 ionic 中的条形码扫描仪阅读器。在ionic serve构建成功处理的同时。但ionic cordova build android --prod --release
我得到了错误。
错误：模块 /var/www/html/mobile/node_modules/@ionic-native/barcode-scanner/index.d.ts 的元数据版本不匹配，在 StaticSymbolResolver.getModuleMetadata (/var/www/html) 找到版本 4，预期为 3 /mobile/node_modules/@angular/compiler/bundles/compiler.umd.js:24474:34) 在 StaticSymbolResolver._createSymbolsOf (/var/www/html/mobile/node_modules/@angular/compiler/bundles/compiler.umd.js :24260:46) 在 StaticSymbolResolver.getSymbolsOf (/var/www/html/mobile/node_modules/@angular/compiler/bundles/compiler.umd.js:24241:14) 在 /var/www/html/mobile/node_modules/ @angular/compiler/bundles/compiler.umd.js:23023:30 at Array.forEach () at extractProgramSymbols (/var/www/html/mobile/node_modules/@angular/compiler/bundles/compiler.umd.js:23022 :79) 在 AotCompiler。compileAll (/var/www/html/mobile/node_modules/@angular/compiler/bundles/compiler.umd.js:22720:47) 在 CodeGenerator.codegen (/var/www/html/mobile/node_modules/@angular/compiler -cli/src/codegen.js:30:14) 在 Function.NgTools_InternalApi_NG_2.codeGen (/var/www/html/mobile/node_modules/@angular/compiler-cli/src/ngtools_api.js:61:30) 在 / var/www/html/mobile/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:182:7330) 在/var/www/html/mobile/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:182:7330) 在/var/www/html/mobile/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:182:73
我不知道该怎么办。请给我一些建议来解决这个问题。
import {BarcodeScanner} from "@ionic-native/barcode-scanner";
scanQR() {
let options = {
prompt: "Place a Qr code inside the scan area",
};
this._barcodeScanner.scan(options).then((barcodeData) => {
if (barcodeData.cancelled) {
console.log("User cancelled the action!");
return false;
}
if (barcodeData.text) {
alert("We got a barcode\n" +
"Result: " + barcodeData.text + "\n" +
"Format: " + barcodeData.format + "\n" +
"Cancelled: " + barcodeData.cancelled);
this.navCtrl.pop();
} else {
this.navCtrl.pop();
}
}, (err) => {
alert(err);
});
}
系统离子信息
cli packages: (/usr/local/lib/node_modules)
@ionic/cli-utils : 1.19.2
ionic (Ionic CLI) : 3.20.0
global packages:
cordova (Cordova CLI) : 7.1.0
local packages:
@ionic/app-scripts : 3.1.11
Cordova Platforms : android 6.3.0 browser 5.0.3
Ionic Framework : ionic-angular 3.6.0
System:
Android SDK Tools : 26.1.1
Node : v9.2.0
npm : 6.1.0
OS : Linux 4.15
Environment Variables:
ANDROID_HOME : /home/anandhsp21/Android/Sdk
Misc:
backend : legacy
解决方案
通过更新 package.json 文件中的依赖关系解决了上述问题
我的旧 package.json 文件
{
"name": "ionic-hello-world",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve --port 8100"
},
"dependencies": {
"@angular/common": "4.1.3",
"@angular/compiler": "4.1.3",
"@angular/compiler-cli": "4.1.3",
"@angular/core": "4.1.3",
"@angular/forms": "4.1.3",
"@angular/http": "4.1.3",
"@angular/platform-browser": "4.1.3",
"@angular/platform-browser-dynamic": "4.1.3",
"@ionic-native/app-availability": "^4.7.0",
"@ionic-native/app-version": "^4.7.0",
"@ionic-native/core": "3.12.1",
"@ionic-native/device": "^4.7.0",
"@ionic-native/facebook": "^4.7.0",
"@ionic-native/fcm": "^4.7.0",
"@ionic-native/google-plus": "^4.7.0",
"@ionic-native/in-app-browser": "^3.14.0",
"@ionic-native/keyboard": "^4.7.0",
"@ionic-native/launch-navigator": "^3.14.0",
"@ionic-native/linkedin": "^4.7.0",
"@ionic-native/native-storage": "^3.12.1",
"@ionic-native/network": "^3.12.1",
"@ionic-native/social-sharing": "^4.7.0",
"@ionic-native/splash-screen": "3.12.1",
"@ionic-native/status-bar": "3.12.1",
"@ionic-native/twitter-connect": "^4.7.0",
"@ionic/cloud-angular": "^0.12.0",
"@ionic/storage": "^2.1.3",
"@ionic2-extra/calendar": "^0.1.6",
"angular2-moment": "^1.9.0",
"bourbon": "^4.2.7",
"branch-cordova-sdk": "^2.6.24",
"cordova-android": "6.3.0",
"cordova-browser": "^5.0.3",
"cordova-custom-config": "^5.0.2",
"cordova-plugin-actionsheet": "^2.3.3",
"cordova-plugin-app-version": "^0.1.9",
"cordova-plugin-appavailability": "^0.4.2",
"cordova-plugin-console": "^1.1.0",
"cordova-plugin-device": "1.1.4",
"cordova-plugin-dialogs": "^2.0.1",
"cordova-plugin-facebook4": "^1.10.1",
"cordova-plugin-fcm": "^2.1.2",
"cordova-plugin-geolocation": "~2.4.1",
"cordova-plugin-googleplus": "^5.3.0",
"cordova-plugin-inappbrowser": "~1.5.0",
"cordova-plugin-ionic-keyboard": "^2.1.2",
"cordova-plugin-nativestorage": "~2.0.2",
"cordova-plugin-network-information": "~1.3.3",
"cordova-plugin-splashscreen": "~4.0.1",
"cordova-plugin-statusbar": "2.2.1",
"cordova-plugin-whitelist": "^1.3.3",
"cordova-plugin-x-socialsharing": "^5.4.0",
"cordova-sqlite-storage": "~2.0.4",
"cordova-support-google-services": "^1.1.0",
"datepicker-ionic2": "^2.3.5",
"es6-promise-plugin": "^4.2.2",
"gulp": "^4.0.0",
"ionic-angular": "3.6.0",
"ionicons": "3.0.0",
"jquery": "^3.3.1",
"moment": "^2.22.2",
"multiple-date-picker": "^2.1.6",
"rxjs": "5.4.0",
"sw-toolbox": "3.6.0",
"twitter-connect-plugin": "git+https://github.com/chroa/twitter-connect-plugin.git",
"uk.co.workingedge.phonegap.plugin.launchnavigator": "^4.2.1",
"xml2js": "^0.4.19",
"zone.js": "^0.8.26"
},
"devDependencies": {
"@ionic/app-scripts": "^3.1.9",
"@types/jquery": "^3.3.2",
"@types/underscore": "^1.8.8",
"husky": "^0.14.3",
"postcss": "6.0.14",
"typescript": "~2.3.4"
},
"cordovaPlugins": [
"cordova-plugin-console",
"cordova-plugin-statusbar",
"cordova-plugin-device",
"cordova-plugin-splashscreen",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": [
"ios",
{
"platform": "ios",
"version": "",
"locator": "ios"
}
],
"description": "ionic3Sample: An Ionic project",
"config": {
"ionic_sass": "./config/sass.config.js"
},
"cordova": {
"platforms": [
"browser",
"android"
],
"plugins": {
"cordova-plugin-device": {},
"cordova-plugin-geolocation": {
"GEOLOCATION_USAGE_DESCRIPTION": " "
},
"cordova-plugin-inappbrowser": {},
"cordova-plugin-nativestorage": {},
"cordova-plugin-network-information": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-statusbar": {},
"cordova-sqlite-storage": {},
"cordova-plugin-console": {},
"cordova-plugin-fcm": {},
"cordova-custom-config": {},
"cordova-plugin-googleplus": {
"REVERSED_CLIENT_ID": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.apps.googleusercontent.com"
},
"twitter-connect-plugin": {
"TWITTER_KEY": "xxxxxxxxxxxxxxxxxxxxxx",
"TWITTER_SECRET": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
"FABRIC_KEY": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
},
"cordova-plugin-appavailability": {},
"cordova-plugin-facebook4": {
"APP_ID": "xxxxxxxxxxxxxxxxxxxxxxx",
"APP_NAME": "xxxxxxxxxxxxxxxxxxxxx"
},
"branch-cordova-sdk": {},
"uk.co.workingedge.phonegap.plugin.launchnavigator": {},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-x-socialsharing": {},
"cordova-plugin-app-version": {},
"cordova-plugin-whitelist": {}
}
}
}
然后我删除了项目中的当前节点模块。
rm -r node_modules
然后我在 package.json 文件中手动更新了这些依赖项
我当前更新的 package.json 文件是
{
"name": "ionic-hello-world",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve --port 8100"
},
"dependencies": {
"@angular/animations": "5.2.11",
"@angular/common": "5.2.11",
"@angular/compiler": "5.2.11",
"@angular/compiler-cli": "5.2.11",
"@angular/core": "5.2.11",
"@angular/forms": "5.2.11",
"@angular/http": "5.2.11",
"@angular/platform-browser": "5.2.11",
"@angular/platform-browser-dynamic": "5.2.11",
"@ionic-native/app-availability": "^4.7.0",
"@ionic-native/app-version": "^4.7.0",
"@ionic-native/barcode-scanner": "^4.11.0",
"@ionic-native/core": "~4.11.0",
"@ionic-native/device": "^4.7.0",
"@ionic-native/facebook": "^4.7.0",
"@ionic-native/fcm": "^4.7.0",
"@ionic-native/google-plus": "^4.7.0",
"@ionic-native/in-app-browser": "^3.14.0",
"@ionic-native/keyboard": "^4.7.0",
"@ionic-native/launch-navigator": "^3.14.0",
"@ionic-native/linkedin": "^4.7.0",
"@ionic-native/native-storage": "^3.12.1",
"@ionic-native/network": "^3.12.1",
"@ionic-native/social-sharing": "^4.7.0",
"@ionic-native/splash-screen": "~4.11.0",
"@ionic-native/status-bar": "~4.11.0",
"@ionic-native/twitter-connect": "^4.7.0",
"@ionic/cloud-angular": "^0.12.0",
"@ionic/storage": "2.1.3",
"@ionic2-extra/calendar": "^0.1.6",
"angular2-moment": "^1.9.0",
"bourbon": "^4.2.7",
"branch-cordova-sdk": "^2.6.24",
"cordova-android": "6.3.0",
"cordova-browser": "^5.0.3",
"cordova-custom-config": "^5.0.2",
"cordova-plugin-actionsheet": "^2.3.3",
"cordova-plugin-app-version": "^0.1.9",
"cordova-plugin-appavailability": "^0.4.2",
"cordova-plugin-console": "^1.1.0",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-dialogs": "^2.0.1",
"cordova-plugin-facebook4": "^1.10.1",
"cordova-plugin-fcm": "^2.1.2",
"cordova-plugin-geolocation": "~2.4.1",
"cordova-plugin-googleplus": "^5.3.0",
"cordova-plugin-inappbrowser": "~1.5.0",
"cordova-plugin-ionic-keyboard": "^2.1.2",
"cordova-plugin-ionic-webview": "^2.0.2",
"cordova-plugin-nativestorage": "~2.0.2",
"cordova-plugin-network-information": "~1.3.3",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "2.2.1",
"cordova-plugin-whitelist": "^1.3.3",
"cordova-plugin-x-socialsharing": "^5.4.0",
"cordova-sqlite-storage": "~2.0.4",
"cordova-support-google-services": "^1.1.0",
"datepicker-ionic2": "^2.3.5",
"es6-promise-plugin": "^4.2.2",
"gulp": "^4.0.0",
"ionic-angular": "3.9.2",
"ionicons": "3.0.0",
"jquery": "^3.3.1",
"moment": "^2.22.2",
"multiple-date-picker": "^2.1.6",
"phonegap-plugin-barcodescanner": "^8.0.0",
"rxjs": "5.5.11",
"sw-toolbox": "3.6.0",
"twitter-connect-plugin": "git+https://github.com/chroa/twitter-connect-plugin.git",
"uk.co.workingedge.phonegap.plugin.launchnavigator": "^4.2.1",
"xml2js": "^0.4.19",
"zone.js": "0.8.26"
},
"devDependencies": {
"@ionic/app-scripts": "3.1.11",
"@types/jquery": "^3.3.2",
"@types/underscore": "^1.8.8",
"husky": "^0.14.3",
"postcss": "6.0.14",
"typescript": "~2.6.2"
},
"cordovaPlugins": [
"cordova-plugin-console",
"cordova-plugin-statusbar",
"cordova-plugin-device",
"cordova-plugin-splashscreen",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": [
"ios",
{
"platform": "ios",
"version": "",
"locator": "ios"
}
],
"description": "ionic3Sample: An Ionic project",
"config": {
"ionic_sass": "./config/sass.config.js"
},
"cordova": {
"platforms": [
"browser",
"android"
],
"plugins": {
"cordova-plugin-device": {},
"cordova-plugin-geolocation": {
"GEOLOCATION_USAGE_DESCRIPTION": " "
},
"cordova-plugin-inappbrowser": {},
"cordova-plugin-nativestorage": {},
"cordova-plugin-ionic-webview": {},
"cordova-plugin-network-information": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-statusbar": {},
"cordova-sqlite-storage": {},
"cordova-plugin-console": {},
"cordova-plugin-fcm": {},
"cordova-custom-config": {},
"cordova-plugin-googleplus": {
"REVERSED_CLIENT_ID": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.apps.googleusercontent.com"
},
"twitter-connect-plugin": {
"TWITTER_KEY": "xxxxxxxxxxxxxxxxxxxxxx",
"TWITTER_SECRET": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
"FABRIC_KEY": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
},
"cordova-plugin-appavailability": {},
"cordova-plugin-facebook4": {
"APP_ID": "xxxxxxxxxxxxxxxxxxxxxxx",
"APP_NAME": "xxxxxxxxxxxxxxxxxxxxx"
},
"branch-cordova-sdk": {},
"uk.co.workingedge.phonegap.plugin.launchnavigator": {},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-x-socialsharing": {},
"cordova-plugin-app-version": {},
"cordova-plugin-whitelist": {},
"phonegap-plugin-barcodescanner": {
"ANDROID_SUPPORT_V4_VERSION": "27.+"
}
}
}
}
而且我还遇到了 facebook 插件与条码扫描器插件之间的一些插件冲突问题。
通过更新 project.properties 文件中的值来解决上述问题
小路
/Your-project/platforms/android/project.properties
# This file is automatically generated by Android Tools.
# Do not modify this file -- YOUR CHANGES WILL BE ERASED!
#
# This file must be checked in Version Control Systems.
#
# To customize properties used by the Ant build system edit
# "ant.properties", and override values to adapt the script to your
# project structure.
#
# To enable ProGuard to shrink and obfuscate your code, uncomment this (available properties: sdk.dir, user.home):
#proguard.config=${sdk.dir}/tools/proguard/proguard-android.txt:proguard-project.txt
# Project target.
target=android-26
android.library.reference.1=CordovaLib
cordova.system.library.1=com.facebook.android:facebook-android-sdk:4.25.0
cordova.system.library.2=com.google.firebase:firebase-core:11.4.2
cordova.system.library.3=com.google.firebase:firebase-messaging:11.4.2
cordova.gradle.include.1=cordova-plugin-fcm/mobile-FCMPlugin.gradle
cordova.system.library.4=com.google.android.gms:play-services-auth:11.4.2
cordova.system.library.5=com.google.android.gms:play-services-identity:11.4.2
cordova.gradle.include.2=phonegap-plugin-barcodescanner/mobile-barcodescanner.gradle
cordova.system.library.7=com.squareup.okhttp3:okhttp:3+
cordova.gradle.include.3=twitter-connect-plugin/mobile-twitter.gradle
cordova.system.library.6=com.android.support:support-v4:27.+
然后我做了以下命令才能正常工作
npm install
ionic cordova platform rm android
ionic cordova build android
ionic cordova build android --prod --release
希望有人有所帮助。
推荐阅读
- javascript - 单击相关图像时如何更改图像和段落
- xml - Tokenize | Transform text from XSL to XML
- angular - Angular 反应式表单：仅获取一次表单有效性状态
- c# - 在序列化/反序列化时识别 dataFile 的类型
- razor - 来自剃刀页面的 Blazor Server .NET 5 身份验证
- ios - UIDocumentInteractionController：无法使用/保存文件
- asp.net-mvc - LINQ to Entities 不支持指定的类型成员“SubArea”
- oracle-apex - 从计算中绑定标签 - oracle apex
- javascript - 将此数组中的数字替换为 %
- arrays - 使用C中的数组打印二维二叉树