The Ionic 2 application encountering issues with building after the installation of the Facebook login plugin

Currently, I am in the process of developing a Hybrid app using Ionic-2 on Ubuntu. I encountered an issue when trying to add Facebook login functionality to my app. After installing the Facebook plugin, the app build fails. However, if I remove the Facebook plugin, the app builds successfully. Any assistance with this matter would be greatly appreciated. Thank you.

The plugin that I installed:

ionic cordova plugin add cordova-plugin-facebook4 --variable APP_ID="123456789" --variable APP_NAME="myApplication"

Error message:

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:processDebugResources'.
> Failed to execute aapt

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

* Get more help at https://help.gradle.org

BUILD FAILED in 17s
 FAILED
25 actionable tasks: 1 executed, 24 up-to-date
(node:30083) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: /mnt/Workspace/work/project/ionic 2/DrinkOrdering/platforms/android/gradlew: Command failed with exit code 1 Error output:
/mnt/Workspace/work/project/ionic 2/DrinkOrdering/platforms/android/app/build/intermediates/manifests/full/debug/AndroidManifest.xml:42: AAPT: error: resource string/fb_app_id (aka drinkordering.com:string/fb_app_id) not found.

/mnt/Workspace/work/project/ionic 2/DrinkOrdering/platforms/android/app/build/intermediates/manifests/full/debug/AndroidManifest.xml:45: AAPT: error: resource string/fb_app_name (aka drinkordering.com:string/fb_app_name) not found.

/mnt/Workspace/work/project/ionic 2/DrinkOrdering/platforms/android/app/build/intermediates/manifests/full/debug/AndroidManifest.xml:49: AAPT: error: resource string/fb_app_name (aka drinkordering.com:string/fb_app_name) not found.

/mnt/Workspace/work/project/ionic 2/DrinkOrdering/platforms/android/app/build/intermediates/manifests/full/debug/AndroidManifest.xml:42: error: resource string/fb_app_id (aka drinkordering.com:string/fb_app_id) not found.
/mnt/Workspace/work/project/ionic 2/DrinkOrdering/platforms/android/app/build/intermediates/manifests/full/debug/AndroidManifest.xml:45: error: resource string/fb_app_name (aka drinkordering.com:string/fb_app_name) not found.
/mnt/Workspace/work/project/ionic 2/DrinkOrdering/platforms/android/app/build/intermediates/manifests/full/debug/AndroidManifest.xml:49: error: resource string/fb_app_name (aka drinkordering.com:string/fb_app_name) not found.
error: failed processing manifest.

Failed to execute aapt
typescriptionic2facebook-login

Answer №1

After experimenting with different configurations, I found that my build became more successful by incorporating the following lines into the <resource> section of the 

platforms/android/app/src/main/res/values/strings.xml
file:

    <string name="fb_app_id">APPID</string>
    <string name="fb_app_name">APPNAME</string>

Although the values already existed in the file, the string names were not quite right.

I attempted to include this code in my main config.xml, but unfortunately, I encountered difficulties in making it work that way. Adding these lines to either res/values/facebookconnect.xml or res/config.xml also proved unsuccessful.

Answer №2

Encountering a frequent Cordova problem

  • To resolve this issue, execute the following command:

    cordova clean

  • Next, rebuild by following these steps :

    ionic cordova build android

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The beauty of crafting intricate forms with Angular's reactive nested

In my Angular project, I am exploring the concept of nesting multiple reactive forms within different components. For instance, I have a component called NameDescComponent that includes a form with two inputs - one for name and one for description, along ...

javascriptangulartypescriptangular-reactive-formsangular-forms

Discovering the Object with the Lowest Key Value in Typescript

Within my TypeScript code, I have defined a List as myList: Package[]. The structure of the Package model is outlined below - export class Package { ID: Number; Price: Number; } I am trying to retrieve a Package object with the lowest Price value using ...

angulartypescript

Angular 8 Issue: Absence of _body and Headers in Response

Our back-end code is written in C# within the .NET environment, targeting the 4.6.1 framework. Recently, our front-end was upgraded from Angular 4 to Angular 8. During this upgrade, webpack transitioned from version 2.3 to version 4.41 and typescript from ...

angulartypescripthttpresponse

Difficulty with the value binding issue on input text produced by *NgFor

When using *ngFor in Angular to loop over an array and generate input text elements bound to the values in the array, I'm encountering some issues. The value is not binding correctly when a user inputs something into the text field. I attempted to ru ...

angulartypescriptdata-bindingngfor

Leveraging Inversify for implementing a Multiinject functionality for a class with both constant and injected parameters

In my Typescript code, I have an insuranceController class that takes a multi inject parameter: @injectable() export class InsuranceController implements IInsuranceController { private policies: IInsurancePolicy[]; constructor(@multiInject("IInsu ...

typescriptinversifyjs

Unable to locate the next/google/font module in my Typescript project

Issue With Import Syntax for Font Types The documentation here provides an example: import { <font-name> } from 'next/google/font'; This code compiles successfully, but throws a "module not found" error at runtime. However, in this disc ...

typescriptnext.jsnrwl-nxnrwl

Is there a way to update the text of a button when it is clicked?

Is there a way to dynamically change the text of a button when it is clicked and revert back to its original text when clicked again? I have attempted something along these lines, but I am unsure how to target the text since there isn't a property si ...

angulartypescriptionic3

What is the best way to transform a for loop using array.slice into a for-of loop or map function in order to generate columns and rows

Experiencing an issue with Angular8. Seeking help to convert a for loop for an array into a loop utilizing either for-of or array.map. The code in question involves passing an array of objects and the need to separate it into col and row arrays for visual ...

arraysangulartypescriptobjectfor-loop

Sequelize.js: Using the Model.build method will create a new empty object

I am currently working with Sequelize.js (version 4.38.0) in conjunction with Typescript (version 3.0.3). Additionally, I have installed the package @types/sequelize at version 4.27.25. The issue I am facing involves the inability to transpile the followi ...

typescriptsequelize.js

The compilation of the module has encountered an error with the PostCSS loader. There is a SyntaxError at line 2, character 14 indicating an unknown

I am developing an Angular 8 application. Currently, I am incorporating AlertifyJs into my project. In the styles.css file of Angular, I have imported these libraries: @import '../node_modules/alertifyjs/build/alertify.min.js'; @import '. ...

javascriptangulartypescriptnode-modules

A guide on parsing a stringified HTML and connecting it to the DOM along with its attributes using Angular

Looking for a solution: "<div style="text-align: center;"><b style="color: rgb(0, 0, 0); font-family: "Open Sans", Arial, sans-serif; text-align: justify;">Lorem ipsum dolor sit amet, consectetur adipiscing e ...

javascriptangulartypescript

Troubleshooting Angular4 and TypeScript Compile Error TS2453: A Comprehensive

I'm facing an issue in my Angular4 project build process which I find quite perplexing. The error seems to be related to the import of certain components such as Response, Headers, and Http from @angular. Whenever I attempt to build my project, it thr ...

angulartypescript

Convert individual packages within the node_modules directory to ES5 syntax

I am currently working on an Angular 12 project that needs to be compatible with Internet Explorer. Some of the dependencies in my node_modules folder are non es5. As far as I know, tsc does not affect node_modules and starts evaluating from the main opti ...

javascriptangulartypescriptbabeljsecmascript-5

The type 'typeof globalThis' does not have an index signature, therefore the element is implicitly of type 'any'. Error code: ts(7017) in TypeScript

I'm encountering an issue with my input handleChange function. Specifically, I am receiving the following error message: Element implicitly has an 'any' type because type 'typeof globalThis' has no index signature.ts(7017) when att ...

typescriptionic-react

Switch from manipulating the DOM to using Angular binding to update the td element with fresh information

When I click the edit button on a tr Element, the tdElement for the redirectUrl should become editable. By using the id of the tdElement and changing the contenteditable attribute to true, I can then use JQuery to retrieve the newly typed data. <tr ng- ...

htmlangularjstypescript

Creating layers of object declarations

Looking for assistance on the code snippet below. type Item = { id: number; size: number; } type Example = { name: string; items: [ Item ]; } var obj: Example = { name: "test", items: [ { i ...

javascriptreactjstypescriptreact-native

Storing string variables within an array and subsequently evaluating the similarity of each variable's value with those stored within the array

I am currently working on an Angular page which consists of input fields where I capture and store values in variables within the .ts file. The entered values are subject to change, so hard-coding them is not feasible. The variables that I use for storing ...

arraysangulartypescript

What type of event does the Input element in material-ui v1 listen for?

I'm currently grappling with material-ui v1 as I search for the appropriate event type for input elements. Take a look at the code snippet below: <Select value={this.numberOfTickets} onChange={this.setNumberOfTickets}> .... Here is the impleme ...

reactjstypescriptmaterial-ui

Understanding and processing HTML strings in typescript

I am currently utilizing TypeScript. Within my code, there is an object named "Reason" where all variables are defined as strings: value, display, dataType, and label. Reason = { value: '<ul><li>list item 1</li><li&g ...

htmlreactjstypescriptparsing

Testing a function in Angular using Karma and Jasmine

I am facing an issue while testing a method in Angular using Jasmine/Karma. The error message I keep encountering is: TypeError: undefined is not iterable (cannot read property Symbol (Symbol.iterator)) This is how I created the method: myMethod(l ...

angulartypescriptunit-testingjasminekarma-jasmine