![](/img/trans.png)
[英]Module name "mysql" has not been loaded yet for context: _. Use require([])
[英]TypeScript export and import Module name has not been loaded yet for context: _. Use require([])
当我尝试在浏览器中运行应用程序时,在调试控制台窗口中出现以下消息:
Module name "Person" has not been loaded yet for context: _. Use require([])
当然,如果合并.ts文件的内容,则所有文件都可以正常工作。
我创建了Person.ts
文件:
export interface IPerson {
firstName: string;
lastName: string;
}
export class Person implements IPerson {
private _middleName: string;
public set middleName(value: string) {
if (value.length <= 0)
throw "Must supply person name";
this._middleName = value;
}
public get middleName(): string {
return this._middleName;
}
constructor(public firstName: string, public lastName: string) { };
Validate() {
alert('test');
}
}
和app.ts
文件:
import {Person} from "./Person"
class Employee extends Person {
Validate() {
alert('new test inside Employee');
}
}
let p1 = new Person("Shahar", "Eldad");
p1.Validate();
try {
p1.middleName = "";
}
catch (err) {
alert(err);
}
let p2 = new Employee("Shahar", "Eldad");
p2.Validate();
document.body.innerHTML = p1.firstName + " " + p2.lastName;
最后是我的index.html
文件:
<!DOCTYPE html>
<html>
<head>
<meta charset="windows-1255">
<title>Insert title here</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.2/require.min.js" data-main="app.js"></script>
</head>
<body>
</body>
</html>
最后是我的tsconfig.json
文件:
{
"compilerOptions": {
"module": "commonjs",
"noImplicitAny": true,
"removeComments": true,
"preserveConstEnums": true,
"sourceMap": true,
"target": "es6"
},
"files": [
"app.ts",
"Person.ts"
]
}
我首先尝试与目标es5进行转译,然后移至es6(最后移至tsconfig.json文件)
更新资料
我确实喜欢@Louis,而且似乎可以正常工作-从问题中复制了所有文件,仅编辑了tsconfig.json以保存amd和es5。 我看不到复制前后的任何区别。 奇怪的。
如果希望RequireJS加载TypeScript编译器的输出,则使用"module": "commonjs"
肯定是错误的。 您应该使用"module": "amd"
。 (您可能还需要将目标更改回es5
。)
您收到的错误是因为使用"module": "commonjs"
,编译器将为您import {Person} from "./Person"
输出与此类似的代码:
var _Person = require("./Person");
var Person = _Person.Person;
对require
的调用将导致RequireJS执行,但将失败,因为RequireJS不直接支持此类代码。 如果上面的代码位于这样的define
,则它将起作用:
define(function (require) {
var _Person = require("./Person");
var Person = _Person.Person;
// Rest of the module.
});
当您使用"module": "amd"
,编译器会生成与此代码段相似的代码,并且可以正常工作。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.