ExecuteFunction不调用该函数

Question

我使用yo office创建了一个Microsoft Office Add-in React（TypeScript）项目。

我改变了我的manifest.xml包括

<Control xsi:type="Button" id="Contoso.GrabSelectionButton">
  <Label resid="Contoso.GrabSelectionButton.Label" />
  <Supertip>
    <Title resid="Contoso.GrabSelectionButton.Label" />
    <Description resid="Contoso.GrabSelectionButton.Tooltip" />
  </Supertip>
  <Icon>
    <bt:Image size="16" resid="Contoso.tpicon_16x16" />
    <bt:Image size="32" resid="Contoso.tpicon_32x32" />
    <bt:Image size="80" resid="Contoso.tpicon_80x80" />
  </Icon>

  <Action xsi:type="ExecuteFunction">
    <FunctionName>grabSelection</FunctionName>
  </Action>
</Control>

<FunctionFile resid="Contoso.DesktopFunctionFile.Url" />设置正确 - 我没有从模板默认更改它。

我在function-file.ts中添加了这样的方法

(() => {
  Office.initialize = () => { console.log("this gets logged..."); };

  function grabSelection(event){
    console.log("grabSelection invoked! - this does not get logged");

    event.completed();
  }

})();

我也尝试过这样的

   (() => {
      Office.initialize = () => { console.log("this gets logged..."); };
    })();

export function grabSelection(event){
  console.log("grabSelection invoked! - this does not get logged");
  event.completed();
}

我可以看到它在运行时被编译和包含但是函数没有被调用...

为什么函数没有被调用？这是webpack没有正确导出函数的问题吗？

Answer 1

我设法通过将我的函数附加到全局命名空间来解决这个问题，如下所示：

(() => {
  Office.initialize = () => {
    console.log("function file loaded...!");
   };
  })();

function grabSelection(event: any): void {
    console.log("i got invoked!!!");
    event.completed();
}

const _global = (window /* browser */ || global /* node */) as any;
_global.grabSelection= grabSelection;