我必须使用 TypeScript 在 Angular 中导入 UnityLoader.js。但是，该库没有 ts 声明并且需要配置变量(数组)才能工作(见下文)。
默认实现:
<!doctype html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | Test Unity</title>
<style>
/* a style sheet needs to be present for cursor hiding and custom cursors to work. */
</style>
</head>
<body>
<canvas class="emscripten" id="canvas" oncontextmenu="event.preventDefault()" height="600px" width="960px"></canvas>
<script type='text/javascript'>
/* Configuration variable here !! */
var Module = {
TOTAL_MEMORY: 268435456,
errorhandler: null, // arguments: err, url, line. This function must return 'true' if the error is handled, otherwise 'false'
compatibilitycheck: null,
dataUrl: "Development/ExportMiniDev.data",
codeUrl: "Development/ExportMiniDev.js",
memUrl: "Development/ExportMiniDev.mem",
};
</script>
/* Library call here !! */
<script src="Development/UnityLoader.js"></script>
</body>
</html>
我已经阅读了所有 docs 并按照 this 创建了一个声明文件。
这里是我的声明文件(index.d.ts):
// Type definitions for UnityLoader 5.4.3.f1
// Project: UnityLoader
// Definitions by: Alexandre Hagen <https://github.com/AlexandreHagen>
declare namespace UnityLoader {
interface Module {
TOTAL_MEMORY: number,
errorhandler?: boolean,
compatibilitycheck?: boolean,
dataUrl: string,
codeUrl: string,
memUrl: string
}
}
export {};
我在 node_modules 中的文件夹结构:
.
├── ...
├── unity-loader
│ ├── index.d.ts # Ts declaration file
│ ├── index.js # It is a remame of UnityLoader.js
│ └── package.js # Package to npm
└── ...
但是有一件事我还是不明白。如何链接到我的声明一个不在 npm 包中而只是一个 .js 的库？事实上，文档似乎只涉及 npm 包。
目前 import unityLoader = require("unity-loader"); 正在工作，但没有导入 UnityLoader.js...所以我不能使用它。
那么我们可以做些什么来在 Typescript 中使用一个简单的全局库呢？ 这个问题对我来说很重要 See here 希望你能帮忙!
Ps:我正在使用 Webpack 来构建我的应用程序。
最佳答案
不确定您是否解决了问题。我已经启动并运行了。但它并不像它应该的那样好。当我转到另一页然后返回时，我会收到错误消息……但这是我所做的…… 我的组件:
import { Component, OnInit } from '@angular/core';
import { Http, Response } from '@angular/http';
import { UnityService } from './unity.service';
declare var jQuery: any;
declare function feet(): any;
declare function water(): any;
@Component({
moduleId: module.id,
selector: 'sd-about',
templateUrl: 'about.component.html',
styleUrls: [ 'about.component.css' ]
})
export class AboutComponent implements OnInit {
public selectedValue: string;
public data: any;
constructor( private http: Http, private _unity: UnityService) {
}
ngOnInit(): void {
jQuery.getScript('app/about/test.js');
jQuery.getScript('assets/Unity/UnityLoader.js');
}
public toggle_feet() {
feet();
}
public toggle_water() {
water();
}
private onError( onError: any ) {
console.log(onError);
}
}
测试.js:
var Module = {
TOTAL_MEMORY: 568435456,
errorhandler: null,
compatibilitycheck: null,
dataUrl: "assets/WebGL/WebGL.data",
codeUrl: "assets/WebGL/WebGL.js",
asmUrl: "assets/WebGL/WebGL.asm.js",
memUrl: "assets/WebGL/WebGL.mem"
};
function unity() {
console.log("Hello from Unity")
}
function water(){
SendMessage("Build","Toggle_Water");
}
function feet(data){
SendMessage("Build","Toggle_Feet", data);
}
希望对您有所帮助! 我目前正在尝试将所有内容移动到服务中并摆脱 jquery....
关于javascript - 创建一个 d.ts 文件到 UnityLoader.js (Unity3D)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41147323/