Search code examples
typescriptnpmreactjsreact-dnd

Visual Studio npm modules


I am using Visual Studio to develop a project. I am using react with typescript. In *.jsx files some of npm modules are giving error like :

Cannot find module 'react-dnd'

I have already installed react-dnd to node_modules. But I cannot stop getting this error.

Here is my code.

import * as React from "react"
import BaseComponent from "../BaseComponent"
import { DragDropContext } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';
import Container from '../../Components/Container';
import Box from '../../Components/Box';

3rd and 4th lines are causing error. In addition I will share my tsconfig file below.

{
  "compilerOptions": {
    "inlineSources": false,
    "jsx": "react",
    "moduleResolution": "node",
    "allowJs": true,
    "noImplicitAny": false,
    "removeComments": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "suppressImplicitAnyIndexErrors": true,
    "declaration": false,
    "isolatedModules": true,
    "sourceMap": false,
    "target": "es5",
    "module": "commonjs",
    "noLib": false,
    "outDir": "wwwroot/js/ts"
  },
  "exclude": [
    "node_modules",
    "wwwroot"
  ],
  "include": [
    "ScriptLib/Components/**/*"
  ]
}

Solution

  • You have to install the type definitions for these libraries:

    npm install --save-dev @types/react-dnd
    npm install --save-dev @types/react-dnd-html5-backend