Ngrx effects are not compatible with earlier versions of TypeScript, causing issues with functionality

Seeking assistance with my Ionic 3 App utilizing ngrx/store and ngrx/effects. However, upon attempting to run the app, I consistently encounter the following error:

TypeScript Error A computed property name in a type literal must directly refer to a built-in symbol. ...: Cannot find name 'any'.

This issue points back to the node_modules/@ngrx/effects/src/on_run_effect.d.ts directory, specifically within this code snippet:

export declare function isOnRunEffects(sourceInstance: {
    [onRunEffectsKey]?: onRunEffectsFn;
}): sourceInstance is OnRunEffects;

A potential solution is to update the typescript version; however, upgrading from the current version of 2.6.1 results in functionality issues during production, including non-functional console.log methods.

Listed below is my ionic info:

Ionic:

   ionic (Ionic CLI)  : 4.0.0-rc.13 (/home/clifford/.npm-global/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.0

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : browser 5.0.4

System:

   Android SDK Tools : 26.1.1
   NodeJS            : v6.12.2 (/usr/local/bin/node)
   npm               : 4.6.1
   OS                : Linux 4.13

Environment:

   ANDROID_HOME : /home/clifford/Android/Sdk

Any assistance would be greatly appreciated. Thank you!

typescriptionic-frameworkionic3ngrxngrx-effects

Answer №1

Perhaps you are currently using the latest version that internally utilizes typescript 3.1.x. We recommend trying to revert back to the specific version (5.2.0) for typescript 2.6.x and then see if it works.

npm install @ngrx/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5526213a273015607b677b65">[email protected]</a> @ngrx/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="187d7e7e7d7b6c6b582d362a3628">[email protected]</a> --save

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

In JavaScript, constructors do not have access to variables

Currently, I am attempting to implement Twilio Access Token on Firebase Functions using TypeScript. export const generateTwilioToken = functions.https.onRequest((req, res) => { const twilioAccessToken = twilio.jwt.AccessToken; const envConfig = fun ...

javascriptnode.jstypescriptfirebasetwilio

Encountering a problem when trying to use event.target.value in an Angular TypeScript application

Here is the code from my app.component.html : <h1>Password Generator</h1> <div> <label>Length</label> </div> <input (input)="onChangeLength($event.target.value)"/> <div> <div> <input ...

htmlangulartypescript

What is the best way to emphasize when the path matches exactly with '/'?

Is there a way to highlight the path only when it exactly matches '/'? Currently, even on 'Page 2', the 'Home' link is still highlighted. Check out the plunker here .active { color: red; } <a routerLinkActive="active" r ...

angulartypescriptangular2-routing

Is it possible for TypeScript to convert a generic enum type into a string at runtime?

Enumerations and interfaces are an important part of my codebase: enum EventId { FOO = 'FOO', BAR = 'BAR', } interface EventIdOptionsMap { [EventId.FOO]: { fooOption: string; }, [EventId.BAR]: { barOption: number; } ...

typescriptenumstypescript-generics

Steps for determining if a string is compatible with a user-defined type in Typescript

Just getting started with Typescript and currently working on a sudoku game. Here are the types and interface I have set up: export type GridCellValue = 1|2|3|4|5|6|7|8|9; export interface GridCell { readonly: boolean, value: GridCellValue|null, } ex ...

typescriptcasting

Developing a TypeScript PureMVC project from scratch

Currently, I am working on a project to implement PureMVC in TypeScript using npm and grunt. Unfortunately, PureMVC has ended development on their project and there is a lack of resources for PureMVC in TypeScript online. The documentation only provides in ...

node.jstypescriptnpmgruntjspuremvc

Encountering an undefined property error while using Array.filter in Angular 2

hello everyone, I am currently faced with an issue while working on a project that involves filtering JSON data. When using the developer tools in Chrome, it keeps showing me an error related to undefined property. chart: JsonChart[] = []; charts: JsonC ...

javascriptangularjstypescriptangularjs-filter

The error message indicates that the property `v.context.$implicit` is not callable

I am a beginner with Typescript and it has only been 3 days. I am trying to access data from Firebase and display it in a list. However, I keep encountering an error when trying to navigate to another page using (Click) ="item ()". Can someone point out wh ...

typescriptionic2

Ensure that the method is triggered

I have a builder class that implements an interface which it is expected to build. However, I would like to enforce one method of this class to be called at compile time, rather than runtime. The class is designed to be used as a chain of method calls and ...

typescript

Can the 'this' keyword be used to declare the type in TypeScript in this manner?

For instance: // ===== Declaration ===== // class A { CONSTANTS_TYPE: { [key: string]: [any] } CONSTANTS: { [key in keyof this['CONSTANTS_TYPE']]: key } bar<T extends keyof this['CONSTANTS_TYPE'] | string>( type: T, ...

typescript

The combination of TypeScript decorators and Reflect metadata is a powerful tool for

Utilizing the property decorator Field, which adds its key to a fields Reflect metadata property: export function Field(): PropertyDecorator { return (target, key) => { const fields = Reflect.getMetadata('fields', target) || []; ...

typescriptreflect-metadata

How can I obtain the model values for all cars in the primary object?

const vehicles={ vehicle1:{ brand:"Suzuki", model:565, price:1200 }, vehicle2:{ brand:"Hyundai", model:567, price:1300 }, vehicle3:{ brand:"Toyota", model ...

javascriptjsontypescriptobject

The function cannot accept a string as an argument, it specifically requires a Blob

Having run into a dilemma here. import React, { useState } from "react"; const PhotoUploader: React.FC = () => { const [photo, setPhoto] = useState(""); let reader = new FileReader(); reader.readAsDataURL(photo); const hand ...

reactjstypescript

Testing a reusable component in Angular using unit testing techniques

Currently, I am creating a test for an AppleComponent which has the following type: <T,U extends BananaComponent<T>>. This component also contains BananaComponent<T>. Target Component export class AppleComponent<T,U extends BananaCom ...

angulartypescriptunit-testing

Ditch the if-else ladder approach and instead, opt for implementing a strategic design

I am currently working on implementing a strategic design pattern. Here is a simple if-else ladder that I have: if(dataKeyinresponse === 'year') { bsd = new Date(moment(new Date(item['key'])).startOf('year&apos ...

javascriptjavadesign-patternstypescriptstrategy-pattern

Using the `require('ts-node/register')` method for programmatic implementation in TypeScript

ts-node recommends using require('ts-node/register'). This is also evident in the angular2-webpack-starter Protractor configuration. What exactly does require('ts-node/register') do? Does it modify require to compile TS files, allowing ...

node.jstypescript

Having trouble extracting parameters with TypeScript in React Router even when they are present

I am in the process of migrating an older project to utilize react and react-router. Additionally, I am fairly new to typescript, which is the language used for this particular project. Any guidance or explanations on these topics would be highly beneficia ...

typescriptreact-router

Injecting Variables Into User-Defined Button

Presenting a custom button with the following code snippet: export default function CustomButton(isValid: any, email: any) { return ( <Button type="submit" disabled={!isValid || !email} style={{ ...

javascriptreactjstypescriptbuttonmaterial-ui

Can a Typescript class type be defined without explicitly creating a JavaScript class?

I am exploring the idea of creating a specific class type for classes that possess certain properties. For example: class Cat { name = 'cat'; } class Dog { name = 'dog'; } type Animal = ???; function foo(AnimalClass: Animal) { ...

javascripttypescript

Tips for integrating Tinymce in Angular 2 once it has reached its stable version

How to Implement TinyMCE in Angular 2 with Two-Way Binding Working with Third-Party Libraries in Angular 2 After trying multiple solutions provided on stackoverflow, I am still unable to load the TinyMCE editor successfully. I am wondering if there are ...

angulartypescripttinymcerich-text-editor