title: Cannot find name 'require' in Typescript
body: <p>Based on the recommendations, this question has been asked many times, but I'm not seeing anything in the answers that solves my issue.</p>
  
  <p>I have created a new ASP.NET Core project in Visual Studio 2015 with the goal of serving an Angular2 TypeScript app and using Webpack to package the scripts. I'm repurposing some of my components from a Webstorm project (same thing - Angular2 and TypeScript), and it works fine there.</p>
  
  <p>Unfortunately, I just copied out the first component and found that I'm running into an error that's not solving itself. In the Visual Studio IDE, I'm getting red squigglies under "require" and the mouseover text reads "Cannot find name 'require'. Cannot resolve symbol 'require'".</p>
  
  <p>Here's the offending component text (the require syntax being used for webpack/Angular2):</p>
  
  <pre><code>@Component({
      selector: "myComponent",
      template: require("./myComponent.html"),
      styles: [require("./myComponent.css")]
  })
  </code></pre>
  
  <p>Similarly, I get the same issue with require with the following snippet too:</p>
  
  <pre><code>const sortBy = require('lodash.sortby');
  </code></pre>
  
  <p>Now, <a href="https://stackoverflow.com/questions/40372788/cannot-find-name-require-templateurl">other</a> posts have an <a href="https://stackoverflow.com/questions/31173738/typescript-getting-error-ts2304-cannot-find-name-require">answer</a> that <a href="https://stackoverflow.com/questions/40124717/angular-2-moved-to-types-giving-error-cannot-find-name-require">suggests</a> that I add typeRoots and types to the tsconfig.json's compilerOptions. I have that as seen here:</p>
  
  <pre><code>{
    "compilerOptions": {
      "target": "es5",
      "module": "commonjs",
      "moduleResolution": "node",
      "typeRoots": [
        "node_modules/@types"
      ],
      "types": [
        "node",
        "lodash.sortby"
      ]
    }
  }
  </code></pre>
  
  <p>Of course, I've added these packages to my package.json:</p>
  
  <pre><code>{
    "dependencies": {
      "lodash.sortby": "^4.7.0"
    },
    "devDependencies": {
      "@types/node": "^6.0.60",
      "@types/lodash.sortby": "^4.7.0"
    }
  }
  </code></pre>
  
  <p>And I've successfully npm installed these (and many other files).</p>
  
  <p>The latter link above indicates that I could just put the following at the top of the file, but that seems rather hacky and isn't something I really want to persist indefinitely in the solution, though admittedly, it does resolve the issue:</p>
  
  <pre><code>declare var require: any
  </code></pre>
  
  <p>As described before, this use of require works fine within Webstorm and I've got the same configurations otherwise between the two IDEs. What's going on with Visual Studio that this isn't just working?</p>
  
  <p>Thanks!</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>I've since learned about the existence of the angular2-template-loader. Since I was looking to use Webpack with Angular2 here, that's why I was using require (per their docs), but this angular2-template-loader is responsible for letting you leave the templateUrl and styleUrls as relative references (and thus not using require to point at the files) and will just swap out everything for you during the packing process. </p>
  
  <p>Using require anywhere else still requires the workaround as described in Gary's link to the Typescript Modules.</p>