我有一个问题,我的加载项在Outlook Online中正常运行,但不会在Outlook桌面上运行 . 加载项已从清单成功激活,但在加载后失败 . 这是一个React TypeScript项目(在Webstorm中使用NodeJS webpack进行测试) .
我已经将问题缩小到使用ANY require语句来导入引用 . 如果我消除它,它运行正常并显示我的测试Office UI Fabric CompoundButton组件 . 使用代码,它会旋转并最终显示一个空白页面 . 不会抛出脚本异常,并且在IE设置中启用此功能 .
为什么这只会在桌面上失败?
要重新编辑,请使用以下三个文件:
-
开始/主页:myapp.tsx
-
呈现TestComponent.tsx
-
其中引用了test.jsx
//myapp.tsx
import TestComponent from './components/TestComponent';
import * as $ from 'jquery';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { AppContainer } from 'react-hot-loader';
const render = (Component) => {
ReactDOM.render(
,
document.getElementById('container')
);
};
Office.initialize = function () {
$(document).ready(function () {
console.log('====myapp.tsx.Office.initialize(): entered');
render(TestComponent);
});
};
if ((module as any).hot) {
console.log('====index.tsx.module() foo');
(module as any).hot.accept('./components/App', () => {
const NextApp = require('./components/App').default;
render(NextApp);
});
}
//TestComponent.tsx
import * as React from 'react';
import { CompoundButton } from 'office-ui-fabric-react/lib/Button';
//============
// BAD CODE!
//import foo = require('../scripts/test.jsx');
//============
export default class TestComponent extends React.Component {
render() {
console.log('====TestComponent.render()');
//============
// BAD CODE!
//foo.testFunction();
//============
return(
Create account
);
}
}
//test.jsx
export function testFunction(){
console.log("test.jsx: testFunction");
}
1 回答
Office 2013和2016 for Windows(桌面应用程序)使用嵌入式IE 11浏览器进行渲染 . IE 11不支持您在Edge,Chrome和Firefox中找到的a lot of the recent JS features . 因此,您需要填充为IE 11提供备用路径所需的功能 .
一个快速修复可能只是改变TypeScript生成JS的方式,以便它与IE 11兼容: