Categories
Development

Why is this React Typescript app throwing errors?

I just created a new React app using npx create-react-app my-app –template typescript and it was working fine until I changed my component to from a stateless one to a stateful one. The error: JSX element type ‘App’ is not a constructor function for JSX elements. TS2605 3 | import App from “./App”; 4 | […]

Categories
Development

How to stop TypeScript error ‘Type A has no properties in common with Type B’ when Type B “extends” Type A in some way

(edited Title to make more general) I’m working in a codebase which uses React class components and Typescript everywhere, and I’m trying to implement react-dropzone (a lightweight, simple but effective file-drop component) using the class-based method. The Hooks implementation is cleaner and simpler but I’d prefer to avoid so as to preserve the paradigm maintained […]

Categories
Development

Protractor – MacOS – SyntaxError: Unexpected token ‘export’

Hi everybody: I have some issues in Protractor. I’m new trying to config Protractor in Mac with VSCode (I couldn’t to that with Eclipse, it was really hard to do) I’m creating a project from the beginning with Protractor. I have created a conf.js file: export const config = { framework: ‘jasmine2’, specs: [‘specs/*.spec.js’], onPrepare: […]

Categories
Development

Report typescript errors as warnings in Visual Studio and don’t fail the build

I want to typecheck existing javascript code. To that end, I have specified the following tsconfig. Running tsc results in a couple of hundred errors, which show up in Visual Studio when I do a build. However those errors now also fail the build. As the code is currently functioning, I want to postpone resolving […]

Categories
Development

typescript cannot find module when import svg file

It’s web application created with Typescript, React and webpack. I want to use svg file through webpack. However, I got TS2307: Cannot find module ‘~/images/slide.svg’. Typescript files are put on /frontend/src/, and typescript files are build successfully. Then, I tried some solutions on website. But I could not solve this problem. What I tried is […]

Categories
Development

Typescript cannot find module defined in paths

I have a typescript application that has paths for absolute imports. My tsconfig looks like this: { “compilerOptions”: { “baseUrl”: “.”, “paths”: { “utils*”: [“src/utils*”], “operations*”: [“src/operations*”], “actions*”: [“src/actions*”], “components*”: [“src/components*”], “constants*”: [“src/constants*”], }, “outDir”: “dist”, “module”: “esnext”, “target”: “esnext”, “moduleResolution”: “node”, “noEmit”: true, “lib”: [“es2017”, “dom”], “noUnusedLocals”: true, “sourceMap”: true, “skipLibCheck”: true, “allowJs”: true, […]

Categories
Development

Nuxt TypeScript error: nuxt:typescript Cannot find module ‘@/my-module’

I have setup Nuxt with TypeScript using the instructions from https://typescript.nuxt.org. The transition was pretty seamless and ok, except that I can’t get rid of this error that nuxt:typescript “Cannot find module”, which obviously is a false-positive. My imports look like this: import InputField from ‘@/components/InputField.vue’ I have tried with ~/ and without the .vue […]

Categories
Development

“Navbar refers to a value, but is being used as a type here” when trying to render a shallow copy of my component when testing

I am trying to write a test to my React component, using TypeScript, Jest as my test runner and Enzyme for testing my React components. Whenever I pass my component into the shallow Enzyme function, I get the ts error “‘Navbar’ refers to a value, but is being used as a type here.”, and underneath […]

Categories
Development

TypeScript: click event’s .target property fails to be found in EventTarget object

In the code below, TypeScript seems to be inspecting what I believe is a base class EventTarget but it can not find the target property. It was working in regular JS before I recently converted this project to TS, so clearly the target property must be there. The alternative is I’m typing this variable incorrectly. […]