电子和打字稿：如何在运行时正确处理模块？-Java 学习之路

我正在使用Typescript编写一个Electron桌面应用程序 . 编译后，项目组织看起来像这样：

dist
html
index.html
个脚本
ApplicationView.js
ApplicationViewModel.js

在 index.html 我有这个脚本标记：

<script src="../scripts/Application.js"></script>

我的所有文件都是从Typescript编译到ES2015（针对ES6并使用ES6模块），并由Babel转换为ES5 . ApplicationView.ts 看起来像这样：

///<reference path="../../typings/main.d.ts" />

import * as $ from "jquery";
import * as ko from "knockout";
import ApplicationViewModel from "./ApplicationViewModel";

$(document).ready(() => {
    ko.applyBindings(new ApplicationViewModel("Hello!"));
});

这是 ApplicationViewModel.ts 的内容：

import * as ko from "knockout";

export default class ApplicationViewModel {
    public greeting: KnockoutObservable<string>;

    constructor(greeting: string) {
        this.greeting = ko.observable(greeting);
    }
}

Electron抛出一个错误，说它无法找到模块 ./ApplicationViewModel . 但是，在调试器控制台中，我可以使用以下命令成功导入模块：

require("../scripts/ApplicationViewModel");

所以，错误是显而易见的 . 脚本标记有效地将 Application.js 的内容复制到HTML文件中，从而更改模块相对路径的上下文 . 我的问题是 what should I really be doing?

我在脚本标签中看到了 require.js 的使用 . 但Electron在Node.js上运行 . 如果这是处理我的问题的正确方法，为什么我需要另一个模块加载器？我怎么能确保这两个玩得好听？

2 回答

0
弄清楚了 . 其实很简单 . 我用以下代码替换了HTML文件中的 <script> 标记：
```
<script>
    require("../scripts/ApplicationView");
</script>
```
奇迹般有效！现在我只需要弄清楚为什么JQuery无法正常工作......
回复于 2024-04-28T19:32:06+08:00

您正在混合使用es5和es6方法导出模块：

module.exports =  ApplicationViewModel; // ES5
export default ApplicationViewModel; // ES6

回复于 2024-04-28T19:32:06+08:00

电子和打字稿：如何在运行时正确处理模块？

2 回答

相关问题