我已经创建了一个 Angular2 组件，并希望与我的同事共享代码。我已将代码上传到 github，克隆了存储库，执行了 npm install 和 npm run tsc，但得到了:
error TS2318: Cannot find global type 'Promise'.
node_modules/@angular/common/src/directives/ng_class.d.ts(48,34): error TS2304: Cannot find name 'Set'.
node_modules/@angular/common/src/pipes/async_pipe.d.ts(44,38): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/application_init.d.ts(16,18): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/application_ref.d.ts(116,76): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/application_ref.d.ts(132,110): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/application_ref.d.ts(158,67): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/application_ref.d.ts(160,101): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/change_detection/differs/default_keyvalue_differ.d.ts(24,15): error TS2304: Cannot find name 'Map'.
node_modules/@angular/core/src/change_detection/differs/default_keyvalue_differ.d.ts(28,16): error TS2304: Cannot find name 'Map'.
node_modules/@angular/core/src/di/reflective_provider.d.ts(87,123): error TS2304: Cannot find name 'Map'.
node_modules/@angular/core/src/di/reflective_provider.d.ts(87,165): error TS2304: Cannot find name 'Map'.
node_modules/@angular/core/src/facade/lang.d.ts(12,17): error TS2304: Cannot find name 'Map'.
node_modules/@angular/core/src/facade/lang.d.ts(13,17): error TS2304: Cannot find name 'Set'.
node_modules/@angular/core/src/linker/compiler.d.ts(53,49): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/linker/compiler.d.ts(61,65): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/linker/ng_module_factory_loader.d.ts(14,34): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/linker/system_js_ng_module_factory_loader.d.ts(28,25): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/src/util/lang.d.ts(12,53): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/testing/component_fixture.d.ts(73,19): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/testing/test_bed.d.ts(85,33): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/core/testing/test_bed.d.ts(134,26): error TS2304: Cannot find name 'Promise'.
node_modules/@angular/http/src/headers.d.ts(52,59): error TS2304: Cannot find name 'Map'.
node_modules/@angular/http/src/url_search_params.d.ts(46,16): error TS2304: Cannot find name 'Map'.
node_modules/rxjs/Observable.d.ts(69,60): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/Observable.d.ts(69,70): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/observable/PromiseObservable.d.ts(40,31): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/observable/PromiseObservable.d.ts(41,26): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(2,60): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(3,79): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(3,89): error TS2304: Cannot find name 'Promise'.
src/my.component.spec.ts(40,13): error TS2697: An async function or method must return a 'Promise'. Make sure you have a declaration for 'Promise' or include 'ES2015' in your `--lib` option.
src/my.service.ts(59,28): error TS2339: Property 'find' does not exist on type 'Cmp[]'.
src/my.service.ts(59,34): error TS7006: Parameter 't' implicitly has an 'any' type.
src/my.service.ts(71,43): error TS2339: Property 'find' does not exist on type 'PartCmp[]'.
src/my.service.ts(71,49): error TS7006: Parameter 'pt' implicitly has an 'any' type.
src/other.service.spec.ts(122,3): error TS2304: Cannot find name 'expect'.
src/other.service.spec.ts(27,1): error TS2304: Cannot find name 'describe'.
src/other.service.spec.ts(28,2): error TS2304: Cannot find name 'beforeEach'.
src/other.service.spec.ts(35,2): error TS2304: Cannot find name 'it'.
这是我的 npm 设置:
"dependencies": {
"@angular/common": "~2.4.0",
"@angular/compiler": "~2.4.0",
"@angular/core": "~2.4.0",
"@angular/forms": "~2.4.0",
"@angular/http": "^2.0.0",
"@angular/platform-browser": "~2.4.0",
"@angular/platform-browser-dynamic": "~2.4.0",
"@angular/router": "~3.4.0",
"angular-in-memory-web-api": "~0.2.2",
"core-js": "^2.4.1",
"reflect-metadata": "^0.1.8",
"rxjs": "^5.0.0-beta.12",
"systemjs": "0.19.40",
"zone.js": "^0.7.4"
},
"devDependencies": {
"jasmine": "^2.5.3",
"karma": "1.2.0",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-coverage": "^1.1.1",
"karma-html-reporter": "^0.2.7",
"karma-jasmine": "^1.0.2",
"lite-server": "^2.2.2",
"systemjs": "^0.19.37",
"typescript": "2.1.5"
}
和我的 tsc 编译器设置
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": true
}, "exclude": ["node_modules"]
}
我已经尝试删除node_modules/、typings/，将依赖项从 Angular 启动器更改为当前依赖项，但我收到了更多错误消息。
有人可以帮助我吗？我的最终目标是让某人克隆我的存储库，运行 npm install 和 npm run tsc，并准备好开发。
更新1: 将 es5 转向 es6 消除了有关 Promise 的错误； Jasmine 错误仍然存在:
src/other.service.spec.ts(122,3): error TS2304: Cannot find name 'expect'.
src/other.service.spec.ts(27,1): error TS2304: Cannot find name 'describe'.
src/other.service.spec.ts(28,2): error TS2304: Cannot find name 'beforeEach'.
src/other.service.spec.ts(35,2): error TS2304: Cannot find name 'it'.
更新2:
我已经更新了依赖项以匹配 Angular-quickstart ( https://github.com/angular/quickstart/blob/master/package.json )。现在可以了，感谢您的帮助!
最佳答案
您在 tsconfig.json 中缺少 Promise 和一些数组方法的声明。请注意下面添加的“lib”属性。
{
"compilerOptions": {
"lib": [
"es2017",
"dom"
],
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": true
},
"exclude": ["node_modules"]
}
此外，正如 @rpadovani 所指出的，您缺少一些用于测试框架的 @types 包。
虽然评论中的一些建议您从 "target": "es5" 更改为 "target": "es2015"，但这是您必须做出的选择非常小心，因为它限制了可以显着定位的浏览器集，除非您打算引入辅助转译器。
在这种情况下，可能不需要更新 "target" 属性，因为诸如 find 之类的 Array 方法可以由 polyfill 提供，例如 core-js，而 Angular 2 本身通过依赖 zone.js 来填充全局 Promise。因此，不要过于仓促地更新 "target"，而是考虑配置 "lib" 选项来获取针对较新运行时/polyfills 的类型信息。
值得注意的是，更新“target”选项是隐式更新“lib”选项的一种方式，这就是建议的原因。但是，更新“target”还会更改 TypeScript 在转译代码时执行的语法降级程度。
考虑
源 TypeScript
class A {
http = new Http();
async retrieve() {
const data = await this.http
.get('api/settings')
.map(r => r.json() as Settings)
.toPromise();
const withId = { ...data, id: 1 };
}
}
发出 JavaScript "target": "es5"
"use strict";
var __assign = (this && this.__assign) || Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t;
return { next: verb(0), "throw": verb(1), "return": verb(2) };
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = y[op[0] & 2 ? "return" : op[0] ? "throw" : "next"]) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [0, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
var A = (function () {
function A() {
this.http = new Http();
}
A.prototype.retrieve = function () {
return __awaiter(this, void 0, void 0, function () {
var data, withId;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, this.http
.get('api/settings')
.map(function (r) { return r.json(); })
.toPromise()];
case 1:
data = _a.sent();
withId = __assign({}, data, { id: 1 });
return [2 /*return*/];
}
});
});
};
return A;
}());
发出的 JavaScript "target": "es2015"
"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
class A {
constructor() {
this.http = new Http();
}
retrieve() {
return __awaiter(this, void 0, void 0, function* () {
const data = yield this.http
.get('api/settings')
.map(r => r.json())
.toPromise();
const withId = Object.assign({}, data, { id: 1 });
});
}
}
发出的 JavaScript "target": "es2017"
"use strict";
class A {
constructor() {
this.http = new Http();
}
async retrieve() {
const data = await this.http
.get('api/settings')
.map(r => r.json())
.toPromise();
const withId = Object.assign({}, data, { id: 1 });
}
}
发出 JavaScript "target": "esnext"
"use strict";
class A {
constructor() {
this.http = new Http();
}
async retrieve() {
const data = await this.http
.get('api/settings')
.map(r => r.json())
.toPromise();
const withId = { ...data, id: 1 };
}
}
关于javascript - Typescript 无法在克隆存储库上编译，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42182076/