Wie liest man die JSON-Datei in TypeScript (intern 4)?

Question

Ich versuche, Daten aus JSON-Datei in meinem UI-Automatisierungsprojekt zu lesen. Ich benutze dafür intern 4. Ich habe das Page Object Model in mein Projekt implementiert und versuche Daten mit der json Datei zu übergeben. Ich habe die Lösung von einer ähnlichen Frage ausprobiert, scheint aber nicht zu funktionieren. Mein Code aufgebaut ist wie folgt:

loginpage.ts 

import {AdvalentBasePage} from "../BasePage"; 
import {DashboardPage} from "../dashboard/DashboardPage"; 
import * as LoginPageLocator from './LoginPageLocator.json' 
export class LoginPage extends BasePage { 
remote: any; 
locator: any; 
constructor(remote: any) { 
    super(remote, LoginPageLocator); 
} 
getPageTitleText(): string { 
    return "Login Page"; 
} 
getPageTitleXpath(): string { 
    return this.locator.PageTitleXpath; 
} 
enterUsername(username: string) { 
    return this.remote.findByXpath(this.locator.userName).type(username); 
} 
enterPassword(password: string) { 
    return this.remote.findByXpath(this.locator.passwoed).type(password); 
} 
async clickSubmitBtn() { 
    var self = this; 
    await self.remote.findByXpath(self.locator.loginBtn).sleep(5000) 
     .click().end().sleep(5000); 
    var dashBoard: DashboardPage = new DashboardPage(self.remote); 
    return Promise.resolve(dashBoard); 
} 
} 

aber seine Fehler geben, wie folgt:

src/pages/login/LoginPage.ts(3,35): error TS2307: Cannot find module './LoginPageLocator.json'. 

Kann jemand bitte helfen.

Answer 1

Sie müssen eine Typisierungsdatei für eine *.json Deklaration erstellen. Zum Beispiel können Sie eine Datei wie json-loader.d.ts erstellen:

declare module "*.json" { 
    const value: any; 
    export default value; 
} 

sollten Sie nichts tun müssen, um speziell mit dieser Datei ... so lange, wie es von tsc abgeholt hat sollten Sie in der Lage seiner .json Dateien wie Sie importieren versuche es zu tun.

Quelle: https://hackernoon.com/import-json-into-typescript-8d465beded79