Behöver lite hjälp med att ställa in Typescript och Highcharts

Jag är ganska ny på TypeScript och jag har försökt att sätta upp ett TypeScript-projekt i Visual Studio 2015 som en HTML-applikation med TypeScript. Mitt problem är hur man importerar eller refererar Highcharts utan fel. Jag behöver en kort beskrivning om hur man sätter upp det enklaste Highchart-diagrammet i min TypeScript-fil. Beskrivningen bör förklara från början.

1) skapa projektet och lägga till Highchart (npm, tsd...) till projektet,

2) att skapa index.html-filen och app.ts (eller namnet på din TypeScript-fil),

3) lägga till referenser i HTML-filen och app.ts, särskilt i app.ts där du anger import eller referenser, som att använda import-satsen eller

< reference path="typings/tsd.d.ts" />

< reference path="typings/highcharts/highcharts.d.ts" />

4) Sätt require-uttryck och lägg dem i en variabel (Jag kan inte få denna kod att fungera ... Vänligen använd ditt sätt att göra detta

var Highcharts = require('highcharts');

// Load module after Highcharts is loaded
require('highcharts/modules/exporting')(Highcharts);

// Create the chart
Highcharts.chart('container', { /*Highcharts options*/ });

5) Slutligen renderar du highchart antingen i app.ts eller genom att använda id:t i index.html-filen

 <div id="container" style="width:100%; height:400px;"></div>

Jag hoppas att någon kan hjälpa mig här. Jag skulle förstås kunna ha gjort allt detta i index.html, men jag vill utnyttja möjligheterna till felsökning i TypeScript.

Relaterade artiklar