Windows WebView 无法调用 webpack 包装的脚本函数答案

【问题标题】：Windows WebView is not able to invoke script function wrapped by webpackWindows WebView 无法调用 webpack 包装的脚本函数
【发布时间】：2018-06-21 22:46:40
【问题描述】：

我有 UWP C# 应用程序，我正在尝试从以下代码调用我的 javascript 函数：

webView.InvokeScriptAsync("myCoolFunc", new List<string> { });

如果我在 *.html 文件中有这样的功能，一切都很好：

<Script>
    function myCoolFunc() {
        //do something...
    }
</Script>

如果我使用 webpack 并将生成的捆绑文件的内容移动到脚本标签中，则不会调用我的函数。 Webpack 将我的函数包装成这样：

<Script>
    ...
    (function(module, exports, __webpack_require__) {

    "use strict";
    /* WEBPACK VAR INJECTION */(function(process) {
    Object.defineProperty(exports, "__esModule", { value: true });
    const store_1 = __webpack_require__(8);
    function myCoolFunc() {
        //do something...
    }
    exports.updateMyFunc = updateMyFunc;
    ...
</Script>

我应该如何设置 webpack.config 或 webView.invokeFunction 以正确调用我的函数？

【问题讨论】：

标签： javascript webpack uwp

【解决方案1】：

公共访问功能

如果你不想公开你的方法，你可以只写一个“通信器”函数，它会调用你的 webpack-wrapped myCoolFunc()，如下所示：

<Script>
    function uwpCommunicator( functionToCall ) {
        if ( functionToCall === "myCoolFunc" ){
            //call myCoolFunc();
        }
    }
</Script>

评估

您还可以使用eval 函数在页面上运行任意脚本：

await webView.InvokeScriptAsync("eval", new string[] { "//your JS code" });

【讨论】：