[Solved]-How do I import d3 (v4) into typescript in an ASP.NET MVC Application?-d3.js

When you import * as d3 from 'd3'; you're requiring the d3 package that is only available locally in your node_modules and therefore will not work in a browser. That's were dependency blunders (such as webpack) come in place, they read all required packages by your code and include them in your build output. However, since you said you're new to Node.js and TypeScript I must warn you that configuring a project using these tools can be quite difficult and the learning curve is rather steep. Make a research on your project needs and if you see that you'll need it at some point, start learning how to use webpack ASAP, since adapting your code later on can be even more painful.

Another option would be to include jQuery and D3.js in the old fashioned way (with normal script tags). In this scenario, to make TypeScript recognize jQuery and D3 even when they're are loaded separately we use what we call "ambient declarations". Those declarations expose the definitions under global variables of these libraries so TypeScript assumes that a global d3 or a $ variable will be available at run time and will hold the API of the libraries that we want. Therefore no import is needed.

Thankfully both "@types/jquery" and "@types/d3" already include these global declarations. For D3 make sure you're installing the definitions for v4 with npm i --save-dev @types/d3@4.x

Another steps that may be required for using vanilla dependencies are some tweaks on your tsconfig.json file. Here's an example:

{
  "compileOnSave": false,
  "buildOnSave": false,
  "compilerOptions": {
    "target": "es5",
    "module": "amd",
    "moduleResolution": "classic",
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "d3",
      "jquery"
    ]
  }
}

Pay attention to module and moduleResolution and pick the options that better suits you. Also note the types option making TypeScript include the ambient declarations from @types/d3 and @types/jquery. Those options are for TypeScript 2.0 by the way.

Honestly its hard for me to say what exactly what you need to do to get everything working since each context requires different setups. But I hope that I at least got you in the right direction to figure out the rest by yourself. Good luck!