The attribute 'finally' is not found on the data type 'Promise<void>'

I've been attempting to implement the finally method on a promise but continue running into this issue.

Property 'finally' does not exist on type 'Promise<void>'.

After researching similar problems, I found suggestions to add "es2018.promise" to the "lib" array in tsconfig.js. However, this leads to the subsequent error:

typescript error
        Argument for '--lib' option must be: 'es5', 'es6', 'es2015', 'es7', 'es2016', 'es2017', 'esnext', 'dom',
        'dom.iterable', 'webworker', 'scripthost', 'es2015.core', 'es2015.collection', 'es2015.generator',
        'es2015.iterable', 'es2015.promise', 'es2015.proxy', 'es2015.reflect', 'es2015.symbol',
        'es2015.symbol.wellknown', 'es2016.array.include', 'es2017.object', 'es2017.sharedmemory', 'es2017.string',
        'es2017.intl', 'esnext.asynciterable'.

Any assistance in resolving this would be greatly welcomed!

angulartypescriptionic-frameworkes6-promise

Answer №1

In order to update your TypeScript 3.3.3 setup, simply include es2018.promise in the compilerOptions.lib section of your tsconfig.json file like this:

"lib": ["es2015", "es2016", "dom", "es2018.promise"]

If you are using vscode, it's advisable to reload the window after making this modification to your tsconfig.json configuration

Answer №2

The support for ES2018 was only introduced in TypeScript 2.7. To fix this issue, make sure to upgrade to version 2.7 or higher.

Answer №3

Even though TypeScript 2.7 offers some support, you must set your target to "ESNEXT" in the tsconfig.json file.

This implies that your code may not be compatible with older browsers or versions of node.js.

The following packages are being used:

"@types/promise.prototype.finally": "^2.0.2"

import { shim as finallyShim } from 'promise.prototype.finally';
finallyShim();

Answer №4

To resolve the issue, I successfully addressed it by implementing https://www.npmjs.com/package/promise.prototype.finally because it appears to be a problem specific to Ionic rather than TypeScript. Hopefully, this will get resolved soon.

I extend my gratitude to all those who assisted me in solving this matter.

Answer №5

Before proceeding, be sure to run 'yarn/npm install' to eliminate the error. The issue should resolve itself post-installation if your tsconfig.json already includes the es2018.promise.

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

Validate certain elements within a form group in a wizard

Within my 2-step wizard, there is a form group in the first step. When the next page button is clicked on the first step, I want to validate the elements in that form group. My questions are: 1 - Would it be more effective to use 2 separate forms in each ...

angulartypescriptwizardformgroups

Unable to load custom package in Angular 2 testing environment

I've been following the official Angular 2 testing guide on an existing project. Everything runs smoothly when I use my custom library, downloadjs, in the application. However, I encounter an error in the console during test execution: "__zone_symbol ...

javascriptnode.jsunit-testingangulartypescript

Tips for adding an item to an array within a Map using functional programming in TypeScript/JavaScript

As I embark on my transition from object-oriented programming to functional programming in TypeScript, I am encountering challenges. I am trying to convert imperative TypeScript code into a more functional style, but I'm struggling with the following ...

javascripttypescriptfunctional-programming

Displaying ASP.Net Core Application on local IIS - Unable to locate content

I started a new project in Visual Studio Code by running the following command: dotnet new angular --use-local-db Afterwards, I upgraded Angular from version 8 to 10 and completed the project. To test it, I used dotnet watch run Everything was running ...

c#asp.netangulariisasp.net-core-3.1

Which components can be interacted with in Protractor?

The element I am attempting to engage with utilizes the ng-sortable attribute and consists of a few draggable and sort-able divs. await viewTransaction.getEl('div#dragdrop-boundary').sendKeys(protractor.Key.ARROW_DOWN); Failed: element not inte ...

typescripttestingselenium-webdriverprotractorng-sortable

Encountering issues during the installation of node modules

An error log is displayed below: 1027 error gyp verb check python checking for Python executable "python2" in the PATH 1027 error gyp verb `which` failed Error: not found: python2 1027 error gyp verb `which` failed at getNotFoundError ...

pythonangularnpm

Creating custom Moment.js plugins within an Ionic 2/Cordova project using TypeScript

In my Typescript Ionic 2 project, I am utilizing the moment.js library. To include it in my project, I use the following code snippet: import * as moment from 'moment'; Once imported, I can use moment in my component like so: let endDate = mom ...

angularcordovatypescriptionic2ionic3

I recently used the ng new ang-routing command to generate a fresh Angular project in my directory, but encountered an error while doing so

npm ERR! syscall read npm ERR! errno ECONNRESET npm ERR! network Invalid response body while trying to fetch https://registry.npmjs.org/@angular-devkit%2fbuild-angular: read ECONNRESET npm ERR! network This issue is likely caused by connectivity problems. ...

angularnpm

Using Generic Types in TypeScript Files for React Components

I have encountered an issue that I haven't been able to find a solution for online. When I define a function in a ts file like this: const lastGeneric = <T>(arr: Array<T>): T => { return arr[arr.length - 1]; } But when I try to do ...

reactjstypescriptgenericstypescript-genericstsx

Tips for isolating shared attributes within MUI Data Grid column configurations

Currently, I am developing a ReactJS Typescript Application using MUI as my component library. My goal is to create a comprehensive CRUD Datagrid similar to the MUI Datagrid component. In the example provided, many columns share common properties. To effic ...

reactjstypescriptmaterial-uimui-datatable

Understanding Restangular with Typescript can be challenging, especially when dealing with a 'restangularized' response object

In my project, I am working with Angular 1.5.x using TypeScript in combination with restangular to access a remote API. Here is an overview of the scenario: The API endpoint I am connecting to is http://localhost:53384/api/timezones. Making a GET request ...

angularjstypescriptangular-promiserestangulartsd

Using Typescript: A guide on including imported images in the output directory

typings/index.d.ts declare module "*.svg"; declare module "*.png"; declare module "*.jpg"; tsconfig.json { "compilerOptions": { "module": "commonjs", "target": "es5", "declaration": true, "outDir": "./dist" }, ...

typescript

What steps can I take to ensure that the upper and left sections of a modal dialog remain accessible even when the size is reduced to the point of overflow?

One issue I'm facing is with a fixed-size modal dialog where part of the content gets cut off and becomes inaccessible when the window shrinks to cause an overflow. More specifically, when the window is narrowed horizontally, the left side is cut off ...

htmlcsstypescript

The Typescript "and" operator is used for combining multiple conditions

I'm having difficulty understanding the functionality of the & operator in TypeScript. I recently encountered this code snippet: type IRecord<T> = T & TypedMap<T>; Can someone explain what this operator does and how it differs fr ...

typescript

Spying on ActivatedRoute.queryParams is not possible in Angular when using Jasmine

Is there a way to effectively spy on a stubbed Angular Service method that should return an Observable like ActivatedRoute.queryParams? The below code snippet shows my failing test case: import { TestBed, ComponentFixture } from "@angular/core/testing"; i ...

angulartestingjasmine

Achieving the functionality of making only one list item in the navbar bolded upon being clicked using React and Typescript logic

Currently, in my navigation bar, I am attempting to make only the active or clicked list item appear bold when clicked. At the moment, I can successfully achieve this effect; however, when I click on other list items, they also become bolded, while the ori ...

javascriptcssreactjstypescriptevents

Why is it necessary to create a model in Angular?

Although I am relatively new to Angular and my understanding of all its concepts is limited, I am curious about the practical use of models in observables. For example, consider this code segment: getRestaurants = (): Observable<Restaurant[]> => ...

angularmodel

Is there a way in Angular to use MatTooltip on an element that is dynamically created?

Currently, I am utilizing the Angular version of FullCalendar and I have a requirement to include a glyphicon on the resources list that triggers angular's MatTooltip upon hovering. The challenge arises when attempting to use element.setAttribute(&apo ...

angularangular-material

Incorrect date format sent to backend through API

Within my Angular + Angular Material application, I am facing an issue with a date range picker. My goal is to send the selected start and end dates in a formatted manner through an API call. However, when the date values are sent over the API as part of t ...

javascriptangulartypescriptangular-material

Searching for columns should be at the top of an angular datatable, not at the bottom

In my Angular 7 project, I am utilizing the library found at this link. I have followed the example provided, which can be seen here. Everything is working perfectly, except for the position of the search columns. I would like the search columns to appear ...

javascriptcssangulardatatablesangular-datatables