title: Use HTML files in Visual Studio Code extension development
body: <p>I want to know if it is possible to use HTML, CSS and JavaScript in separated files to create a extension in Visual Studio Code.</p>
  
  <p>I'm using VS Code Webview API. I tried to create a folder and put my HTML and CSS files but it didn't work. I don't now how to use these files on the extension GUI. I even tried to use NodeJS <code>readFile()</code> to read the HTML file but it failed to read the file. Relative path using <code>./html/file...</code> didn't work.</p>
  
  <p>What am I missing? I'm pretty new at JS, Node and VS Code...</p>
  
  <p>In the docs example they put the HTML inside a string like this:</p>
  
  <pre class="lang-ts prettyprint-override"><code>import * as vscode from 'vscode';
  
  export function activate(context: vscode.ExtensionContext) {
  context.subscriptions.push(vscode.commands.registerCommand('catCoding.start', 
  () =&gt; {
      // Create and show panel
      const panel = vscode.window.createWebviewPanel('catCoding', "Cat Coding", 
      vscode.ViewColumn.One, { });
  
      // And set its HTML content
      panel.webview.html = getWebviewContent();
  }));
  }
  
  function getWebviewContent() {
      return `&lt;!DOCTYPE html&gt;
      &lt;html lang="en"&gt;
      &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;title&gt;Cat Coding&lt;/title&gt;
      &lt;/head&gt;
      &lt;body&gt;
      &lt;img src="https://media.giphy.com/media/JIX9t2j0ZTN9S/giphy.gif" width="300" /&gt;
      &lt;/body&gt;
      &lt;/html&gt;`;
  }
  </code></pre>
  
  <p>Is it possible to put the HTML or at least the JS and CSS in a separated file? This way would be possible to use libs and have a cleaner code.</p>
  
  <p>Link to the docs: <a href="https://code.visualstudio.com/docs/extensions/webview" rel="nofollow noreferrer">VS Code Webview API</a></p>
  
  <p>Thanks!</p>