Je vis ce problème et ne semble pas avoir de réponse à ce jour. Bien que je voie tslib dans mon dossier node_modules. Appréciez si quelqu'un peut aider à identifier ce qui ne va pas avec mon code. J'ai vu d'autres réponses à une question similaire, j'ai essayé de supprimer node_modules et de reconstruire l'ensemble du projet. Mais j'ai toujours le même problème
Uncaught Error: Cannot find module "tslib".
at webpackEmptyContext (VM2488 main.js:11)
at VM2487 vendor.js:30768
at Push../node_modules/@angular/compiler/src/core.js (VM2487 vendor.js:30756)
at Object../node_modules/@angular/compiler/src/core.js (VM2487 vendor.js:30765)
at __webpack_require__ (VM2484 runtime.js:77)
at Object../src/app/data.service.ts (VM2488 main.js:2712)
at __webpack_require__ (VM2484 runtime.js:77)
at Object../src/app/Security/Security.service.ts (VM2488 main.js:1923)
at __webpack_require__ (VM2484 runtime.js:77)
at Object../src/app/Security/Security.component.ts (VM2488 main.js:1556)
Package.json
{
"name": "ranetworkfe",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "^6.0.3",
"@angular/cli": "^6.1.2",
"@angular/common": "^6.0.3",
"@angular/compiler": "^6.0.3",
"@angular/core": "^6.0.3",
"@angular/forms": "^6.0.3",
"@angular/http": "^6.0.3",
"@angular/platform-browser": "^6.0.3",
"@angular/platform-browser-dynamic": "^6.0.3",
"@angular/router": "^6.0.3",
"bootstrap": "^4.1.3",
"core-js": "^2.5.4",
"express": "^4.16.3",
"font-awesome": "^4.7.0",
"jasmine": "^3.1.0",
"jquery": "^3.3.1",
"rxjs": "^6.2.2",
"rxjs-compat": "^6.2.2",
"tslib": "^1.9.3",
"zone.js": "^0.8.26"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.6.8",
"@angular/cli": "^6.1.2",
"@angular/compiler-cli": "^6.0.3",
"@angular/language-service": "^6.0.3",
"@types/jasmine": "~2.8.6",
"@types/jasminewd2": "~2.0.3",
"@types/node": "~8.9.4",
"codelyzer": "~4.2.1",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~1.7.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.0",
"karma-jasmine": "~1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "^5.4.0",
"ts-node": "~5.0.1",
"tslint": "~5.9.1",
"tslib": "^1.9.3",
"TypeScript": "~2.7.2"
}
}
tsconfig.js
{
"compilerOptions": {
"baseUrl": "",
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": ["es6", "dom"],
"mapRoot": "./",
"module": "es6",
"moduleResolution": "node",
"outDir": "../dist/out-tsc",
"sourceMap": true,
"target": "es5",
"importHelpers": true,
"typeRoots": [
"../node_modules/@types"
]
}
}
DataService.ts
/*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.Apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Injectable } from '@angular/core';
import { Http, Response, Headers } from '@angular/http';
import { Observable } from 'rxjs';
import { map, filter, scan, catchError } from 'rxjs/operators';
import { Type } from '@angular/compiler/src/core';
@Injectable()
export class DataService<Type> {
private resolveSuffix = '?resolve=true';
private actionUrl: string;
private headers: Headers;
constructor(private http: Http) {
this.actionUrl = '/api/';
this.headers = new Headers();
this.headers.append('Content-Type', 'application/json');
this.headers.append('Accept', 'application/json');
}
public getAll(ns: string): Observable<Type[]> {
console.log('GetAll ' + ns + ' to ' + this.actionUrl + ns);
return this.http.get(`${this.actionUrl}${ns}`).pipe(
map(response => {
const chamados = response.json();
return chamados.map((chamado) => new Type(chamado));
// catchError(this.handleError);
}
// catchError(this.handleError);
)
// catchError(this.handleError);
).catch(this.handleError)
//.map(this.extractData)
}
public getSingle(ns: string, id: string): Observable<Type> {
console.log('GetSingle ' + ns);
return this.http.get(this.actionUrl + ns + '/' + id + this.resolveSuffix).pipe(
//.map(this.extractData)
map(response => {
const chamados = response.json();
return chamados.map((chamado) => new Type(chamado));
}
)
)
//catchError(this.handleError);
}
public add(ns: string, asset: Type): Observable<Type> {
console.log('Entered DataService add');
console.log('Add ' + ns);
console.log('asset', asset);
return this.http.post(this.actionUrl + ns, asset).pipe(
//.map(this.extractData)
map(response => {
const chamados = response.json();
return chamados.map((chamado) => new Type(chamado));
}))
// catchError(this.handleError);
//.map(this.extractData)
//.catch(this.handleError);
}
public update(ns: string, id: string, itemToUpdate: Type): Observable<Type> {
console.log('Update ' + ns);
console.log('what is the id?', id);
console.log('what is the updated item?', itemToUpdate);
console.log('what is the updated item?', JSON.stringify(itemToUpdate));
return this.http.put(`${this.actionUrl}${ns}/${id}`, itemToUpdate).pipe(
//.map(this.extractData)
map(response => {
const chamados = response.json();
return chamados.map((chamado) => new Type(chamado));
}))
// catchError(this.handleError);
// .map(this.extractData)
//.catch(this.handleError);
}
public delete(ns: string, id: string): Observable<Type> {
console.log('Delete ' + ns);
return this.http.delete(this.actionUrl + ns + '/' + id).pipe(
//.map(this.extractData)
map(response => {
const chamados = response.json();
return chamados.map((chamado) => new Type(chamado));
}))
//catchError(this.handleError);
// .map(this.extractData)
//.catch(this.handleError);
}
private handleError(error: any): Observable<string> {
// In a real world app, we might use a remote logging infrastructure
// We'd also Dig deeper into the error to get a better message
const errMsg = (error.message) ? error.message :
error.status ? `${error.status} - ${error.statusText}` : 'Server error';
console.error(errMsg); // log to console instead
return Observable.throw(errMsg);
}
private extractData(res: Response): any {
return res.json();
}
}
J'ai résolu le problème en supprimant la mauvaise importation pour le type. Cela devrait venir du noyau angulaire
enlevé
import { Type } from '@angular/compiler/src/core';
mis à jour
import { Injectable, Type } from '@angular/core';
Pour moi, le problème était la mauvaise version de TypeScript - j'avais 2.6.x. Sur un pressentiment, je suis passé à la dernière version 3.1.6, puis j'ai reçu ce message utile.
Le compilateur angulaire nécessite TypeScript> = 2.7.2 et <2.10.0 mais 3.1.6 a été trouvé à la place.
J'ai donc essayé la version 2.9.2 et le problème a été résolu.