title: Excel Web Add-in Custom Function using Visual Studio
body: <p>I have created Excel Web Addin project using VS 2019 and trying to incorporate Custom Functions into this project. Unfortunately all the documentation on MSDN refer to Yeoman generator so I am not sure either VS created project doesn't support custom functions OR I am missing something?
  I have added following factor under HOST</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;AllFormFactors&gt;
            &lt;ExtensionPoint xsi:type="CustomFunctions"&gt;
              &lt;Script&gt;
                &lt;SourceLocation resid="CustomFunction.Script" /&gt;
              &lt;/Script&gt;
              &lt;Page&gt;
                &lt;SourceLocation resid="CustomFunction.Page" /&gt;
              &lt;/Page&gt;
              &lt;Namespace resid="CustomFunction.Namespace" /&gt;
            &lt;/ExtensionPoint&gt;
          &lt;/AllFormFactors&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>And all the URL point to the files which I created</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;bt:Url id="CustomFunction.Script" DefaultValue="~remoteAppUrl/CustomFunctions/CustomFunction.js" /&gt;
          &lt;bt:Url id="CustomFunction.Page" DefaultValue="~remoteAppUrl/CustomFunctions/CustomFunction.html" /&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>My CustomFunction.js file content looks like:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>// The initialize function must be run each time a new page is loaded.
  (function () {
      Office.initialize = function (reason) {
          // If you need to initialize something you can do so here.
      };
  
      /**
       * Add two numbers
       * @customfunction
       * @param {number} first First number
       * @param {number} second Second number
       * @returns {number} The sum of the two numbers.
       */
      function add2(first, second) {
          return first + second;
      }
  
      CustomFunctions.associate("ADD2", add2);
  
  })();</code></pre>
  </div>
  </div>
  
  And HTML file look like</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8" /&gt;
      &lt;meta http-equiv="X-UA-Compatible" content="IE=Edge" /&gt;
      &lt;meta http-equiv="Expires" content="0" /&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;script src="https://appsforoffice.microsoft.com/lib/1.1/hosted/custom-functions-runtime.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>I can debug the project successfully and when I run it, Excel open but no add-in loaded into it.
  Can anyone point out the right direction please?</p>