尚未为上下文加载TypeScript导出和导入模块名称：_。使用require（[]） [英] TypeScript export and import Module name has not been loaded yet for context: _. Use require([])
问题描述
当我尝试在浏览器中运行应用程序时，我在调试控制台窗口中看到以下消息：
When I try to run the application in the browser I get in the debug console window the following message:
Module name "Person" has not been loaded yet for context: _. Use require([])
当然，如果合并.ts文件的内容全部工作正常。
Of course if merge the content of the .ts files all is working perfectly.
我创建了 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 file：
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文件中）
I tried at first to transpile with target es5 and then I moved to es6 (and last moved to the tsconfig.json file)
更新
我确实喜欢@Louis并且它似乎有用 - 复制了我的所有文件问题并且只编辑了tsconfig.json来保存amd和es5。我看不出复制之前和之后有任何区别。很奇怪。
I did like @Louis and it seems to work - copied all files from my question and only edited tsconfig.json to hold amd and es5. I couldn`t see any difference between the before and after the copy. Weird.
推荐答案
使用module：commonjs当你希望TypeJ编译器的输出由RequireJS加载，绝对是错误的。你应该使用module：amd。 （您可能需要将目标更改回 es5 。）
Using "module": "commonjs" when you want the output of the TypeScript compiler to be loaded by RequireJS, is definitely wrong. You should use "module": "amd". (You may need to change change your target back to es5 too.)
您得到的错误是因为module：commonjs，编译器将从./Person\" import {Person}输出与此类似的代码c $ c>：
The error you get is because with "module": "commonjs", the compiler will output code similar to this for your import {Person} from "./Person":
var _Person = require("./Person");
var Person = _Person.Person;
调用 require 将导致RequireJS执行但会失败因为RequireJS不直接支持这样的代码。如果它在 define 中，则上面的代码可以工作：
The call to require will cause RequireJS to execute but that will fail because RequireJS does not support such code directly. The code above would work if it is in a define like this:
define(function (require) {
var _Person = require("./Person");
var Person = _Person.Person;
// Rest of the module.
});
当你使用module时：amd，编译器生成类似于此代码片段的代码并且它可以工作。
When you use "module": "amd", the compiler produces code similar to this snippet and it works.
这篇关于尚未为上下文加载TypeScript导出和导入模块名称：_。使用require（[]）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
