{"id":15190,"date":"2024-04-01T17:08:49","date_gmt":"2024-04-01T13:38:49","guid":{"rendered":"https:\/\/www.itpiran.net\/blog\/?p=15190"},"modified":"2024-04-01T17:08:49","modified_gmt":"2024-04-01T13:38:49","slug":"typescript-new-projectstep-1-starting-the-typescript-project","status":"publish","type":"post","link":"https:\/\/www.itpiran.net\/blog\/de\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/","title":{"rendered":"Wie man ein neues TypeScript-Projekt startet"},"content":{"rendered":"<h2 id=\"%d9%85%d9%82%d8%af%d9%85%d9%87\">Einf\u00fchrung<\/h2>\n<p>Vielleicht haben Sie bereits mit TypeScript gearbeitet, beispielsweise mit einem Starterprojekt oder einem Tool wie der Angular CLI. In diesem Tutorial lernen Sie, wie Sie ein TypeScript-Projekt ohne Starterprojekt einrichten. Au\u00dferdem erfahren Sie, wie die Kompilierung in TypeScript funktioniert und wie Sie einen Linter in Ihrem TypeScript-Projekt verwenden.<\/p>\n<h5 id=\"%d9%be%db%8c%d8%b4-%d9%86%db%8c%d8%a7%d8%b2%d9%87%d8%a7\">Voraussetzungen<\/h5>\n<ul>\n<li>Die neueste Version von Node ist auf Ihrem Ger\u00e4t installiert.<\/li>\n<li>Kennenlernen\u00a0 <code>npm<\/code><\/li>\n<\/ul>\n<h2 id=\"%d9%85%d8%b1%d8%ad%d9%84%d9%87-1-%d8%b4%d8%b1%d9%88%d8%b9-%d9%be%d8%b1%d9%88%da%98%d9%87-typescript\">Schritt 1 \u2013 Ein TypeScript-Projekt starten<\/h2>\n<p>Um Ihr TypeScript-Projekt zu starten, m\u00fcssen Sie ein Verzeichnis f\u00fcr Ihr Projekt erstellen:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\">mkdir typescript-project<\/pre>\n<\/div>\n<p>Wechseln Sie nun in Ihr Projektverzeichnis:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>cd typescript-project<\/code><\/pre>\n<\/div>\n<p>Sie k\u00f6nnen TypeScript installieren, indem Sie Ihr Projektverzeichnis einrichten:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>npm i typescript --save-dev<\/code><\/pre>\n<\/div>\n<p>Es ist wichtig, dass die Flagge <code>--save-dev<\/code> F\u00fcgen Sie TypeScript hinzu, da es TypeScript als Entwicklungsabh\u00e4ngigkeit speichert. Dies bedeutet, dass TypeScript f\u00fcr die Entwicklung Ihres Projekts erforderlich ist.<\/p>\n<p>Nach der Installation von TypeScript k\u00f6nnen Sie Ihr TypeScript-Projekt mit folgendem Befehl initialisieren:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>npx tsc --init<\/code><\/pre>\n<\/div>\n<p><code>npm<\/code> Es verf\u00fcgt au\u00dferdem \u00fcber ein Werkzeug namens <code>npx<\/code> welches ausf\u00fchrbare Pakete ausf\u00fchrt. <code>npx<\/code> Dadurch k\u00f6nnen wir Pakete ausf\u00fchren, ohne dass eine globale Installation erforderlich ist.<\/p>\n<p>Befehl <code>tsc<\/code> Es wird hier verwendet, weil es der integrierte Compiler f\u00fcr TypeScript ist. Wenn Sie Code in TypeScript schreiben, wird die Ausf\u00fchrung <code>tsc<\/code> Es konvertiert oder kompiliert Ihren Code in JavaScript.<\/p>\n<p>Verwendung der Flagge <code>--init<\/code> Der obige Befehl initialisiert Ihr Projekt, indem er eine tsconfig.json-Datei in Ihrem TypeScript-Projektverzeichnis erstellt. Mithilfe dieser tsconfig.json-Datei k\u00f6nnen Sie weitere Konfigurationen vornehmen und die Interaktion zwischen TypeScript und dem Compiler festlegen. <code>tsc<\/code> Anpassen. Sie k\u00f6nnen Konfigurationen in dieser Datei entfernen, hinzuf\u00fcgen und \u00e4ndern, um sie optimal an Ihre Bed\u00fcrfnisse anzupassen.<\/p>\n<p><code>tsconfig.json<\/code> \u00d6ffnen Sie die Datei in Ihrem Editor, um die Standardkonfiguration zu finden:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>nano tsconfig.json<\/code><\/pre>\n<\/div>\n<p>Es wird viele Optionen geben, von denen die meisten im Folgenden erl\u00e4utert werden:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-ts\" data-lang=\"TypeScript\"><code>{\r\n\"compilerOptions\": {\r\n\/* Visit https:\/\/aka.ms\/tsconfig.json to read more about this file *\/\r\n\/* Projects *\/\r\n\/\/ \"incremental\": true, \/* Enable incremental compilation *\/\r\n\/\/ \"composite\": true, \/* Enable constraints that allow a TypeScript project to be used with project references. *\/\r\n\/\/ \"tsBuildInfoFile\": \".\/\", \/* Specify the folder for .tsbuildinfo incremental compilation files. *\/\r\n\/\/ \"disableSourceOfProjectReferenceRedirect\": true, \/* Disable preferring source files instead of declaration files when referencing composite projects *\/\r\n\/\/ \"disableSolutionSearching\": true, \/* Opt a project out of multi-project reference checking when editing. *\/\r\n\/\/ \"disableReferencedProjectLoad\": true, \/* Reduce the number of projects loaded automatically by TypeScript. *\/\r\n. . .\r\n}\r\n}<\/code><\/pre>\n<\/div>\n<p>Sie k\u00f6nnen Ihre TypeScript-Konfiguration \u00fcber die Datei tsconfig.json anpassen. Beispielsweise k\u00f6nnen Sie den Eintrag outDir einkommentieren und auf \u201c.\/build\u201d setzen, wodurch alle Ihre kompilierten TypeScript-Dateien in diesem Verzeichnis abgelegt werden.<\/p>\n<p>Durch die Installation von TypeScript und der Datei <code>tsconfig.json<\/code>Jetzt k\u00f6nnen Sie mit dem Codieren der TypeScript-Anwendung und deren Kompilierung beginnen.<\/p>\n<h2 id=\"%d9%85%d8%b1%d8%ad%d9%84%d9%87-2-%da%a9%d8%a7%d9%85%d9%be%d8%a7%db%8c%d9%84-%d9%be%d8%b1%d9%88%da%98%d9%87-typescript\">Schritt 2 \u2013 Das TypeScript-Projekt kompilieren<\/h2>\n<p>Jetzt k\u00f6nnen Sie mit der Programmierung Ihres TypeScript-Projekts beginnen. Erstellen Sie eine neue Datei mit dem Namen <code>index.ts<\/code> \u00d6ffnen Sie die Datei in Ihrem Editor. F\u00fcgen Sie den folgenden TypeScript-Code ein. <code>index.ts<\/code> Schreiben:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-ts\" data-lang=\"TypeScript\"><code>const world = 'world';\r\nexport function hello(who: string = world): string {\r\nreturn `Hello ${who}! `;\r\n}<\/code><\/pre>\n<\/div>\n<p>Nachdem dieser TypeScript-Code eingef\u00fcgt wurde, ist Ihr Projekt bereit zum Kompilieren. F\u00fchren Sie tsc in Ihrem Projektverzeichnis aus:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>npx tsc<\/code><\/pre>\n<\/div>\n<p>Sie werden feststellen, dass sowohl die kompilierte JavaScript-Datei index.js als auch die Sourcemap-Datei index.js.map dem Build-Ordner hinzugef\u00fcgt werden, sofern Sie dies in der tsconfig.js-Datei angegeben haben.<\/p>\n<p><code>index.js<\/code> \u00d6ffnen Sie die Datei, und Sie sehen folgenden kompilierten JavaScript-Code:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-ts\" data-lang=\"TypeScript\"><code>\"use strict\";\r\nObject.defineProperty(exports, \"__esModule\", { value: true });\r\nexports.hello = void 0;\r\nconst world = 'world';\r\nfunction hello(who = world) {\r\nreturn `Hello ${who}! `;\r\n}\r\nexports.hello = hello;<\/code><\/pre>\n<\/div>\n<p>Das Ausf\u00fchren des TypeScript-Compilers bei jeder \u00c4nderung kann m\u00fchsam sein. Um dies zu vermeiden, k\u00f6nnen Sie den Compiler in den \u00dcberwachungsmodus versetzen. Dadurch wird Ihr Code bei jeder \u00c4nderung neu kompiliert.<\/p>\n<p>Sie k\u00f6nnen den \u00dcberwachungsmodus mit folgendem Befehl aktivieren:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>npx tsc -w<\/code><\/pre>\n<\/div>\n<p>Sie haben gelernt, wie der TypeScript-Compiler funktioniert und k\u00f6nnen Ihre TypeScript-Dateien nun erfolgreich kompilieren. Sie k\u00f6nnen Ihre TypeScript-Projekte auf die n\u00e4chste Stufe heben, indem Sie einen Linter in Ihren Workflow integrieren.<\/p>\n<h2 id=\"%d9%85%d8%b1%d8%ad%d9%84%d9%87-3-%d8%a7%d8%b3%d8%aa%d9%81%d8%a7%d8%af%d9%87-%d8%a7%d8%b2-google-typescript-style-%d8%a8%d8%b1%d8%a7%db%8c-%d9%be%d8%b1-%da%a9%d8%b1%d8%af%d9%86-%d9%88-%d8%aa\">Schritt 3 \u2013 Verwenden Sie Google TypeScript Style, um Ihren Code zu vervollst\u00e4ndigen und zu korrigieren.<\/h2>\n<p>Die Verwendung eines Linters beim Programmieren hilft Ihnen, Inkonsistenzen, Syntaxfehler und fehlende Elemente in Ihrem Code schnell zu finden. Ein Styleguide tr\u00e4gt nicht nur dazu bei, dass Ihr Code wohlgeformt und konsistent ist, sondern erm\u00f6glicht Ihnen auch die Verwendung zus\u00e4tzlicher Tools, um diesen Stil durchzusetzen. Ein beliebtes Tool hierf\u00fcr ist ESLint, das mit vielen IDEs gut zusammenarbeitet und den Entwicklungsprozess unterst\u00fctzt.<\/p>\n<p>Sobald Ihr Projekt l\u00e4uft, k\u00f6nnen Sie andere Tools aus dem TypeScript-\u00d6kosystem nutzen, um die manuelle Konfiguration Ihrer tsconfig.json-Datei zu vermeiden. Google TypeScript Style (GTS) ist eines dieser Tools. GTS vereint Styleguide, Inline-Stylesheet und automatische Codekorrektur in einem. Mit GTS starten Sie Ihr neues TypeScript-Projekt schnell und k\u00f6nnen sich ganz auf das Design konzentrieren, ohne sich um organisatorische Details k\u00fcmmern zu m\u00fcssen. GTS bietet zudem Standardeinstellungen, sodass Sie nur wenige Einstellungen anpassen m\u00fcssen.<\/p>\n<p>Beginnen Sie mit der Installation von GTS:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>npm i gts --save-dev<\/code><\/pre>\n<\/div>\n<p>Initialisieren Sie nun das GTS mit folgendem Befehl:<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-bash\" data-lang=\"Bash\"><code>npx gts init<\/code><\/pre>\n<\/div>\n<p>Der obige Befehl erstellt alles, was Sie f\u00fcr den Einstieg in TypeScript ben\u00f6tigen, einschlie\u00dflich einer tsconfig.json-Datei und einer Linting-Konfiguration. Falls noch keine package.json-Datei vorhanden ist, wird diese ebenfalls erstellt.<\/p>\n<p>Durch Ausf\u00fchren von `npx gts init` werden au\u00dferdem n\u00fctzliche npm-Skripte zu Ihrer `package.json`-Datei hinzugef\u00fcgt. Beispielsweise k\u00f6nnen Sie nun `npm run compile` ausf\u00fchren, um Ihr TypeScript-Projekt zu kompilieren. Um nach Fehlern zu suchen, k\u00f6nnen Sie jetzt `npm run check` ausf\u00fchren.<\/p>\n<p>GTS ist nun installiert und ordnungsgem\u00e4\u00df in Ihr TypeScript-Projekt integriert. Durch die Verwendung von GTS in zuk\u00fcnftigen Projekten k\u00f6nnen Sie neue TypeScript-Projekte schnell mit den erforderlichen Einstellungen einrichten.<\/p>\n<p>Da GTS einen konfigurierungsfreien, meinungsbasierten Ansatz verfolgt, verwendet es eigene sinnvolle Regeln. Diese orientieren sich an bew\u00e4hrten Verfahren. Sollten Sie die Regeln dennoch anpassen m\u00fcssen, k\u00f6nnen Sie dies durch Erweitern der Standard-ESLint-Regeln tun. Erstellen Sie dazu im Projektverzeichnis eine Datei namens `.eslintrc`, die die Stilregeln erweitert.<\/p>\n<div class=\"hcb_wrap\" data-no-translation=\"\" data-no-auto-translation=\"\">\n<pre class=\"prism line-numbers lang-plain\" data-lang=\"Plain Text\"><code>---\r\nextends:\r\n- '.\/node_modules\/gts'<\/code><\/pre>\n<\/div>\n<p>Dies erm\u00f6glicht es Ihnen, die von GTS bereitgestellten Stilregeln hinzuzuf\u00fcgen oder zu \u00e4ndern.<\/p>\n<h2 id=\"%d9%86%d8%aa%db%8c%d8%ac%d9%87\">Ergebnis<\/h2>\n<p>In diesem Tutorial haben Sie ein TypeScript-Projekt mit benutzerdefinierten Einstellungen erstellt. Au\u00dferdem haben Sie Google TypeScript Style in Ihr Projekt integriert. Mit GTS k\u00f6nnen Sie schnell mit einem neuen TypeScript-Projekt loslegen. Dank GTS m\u00fcssen Sie die Konfiguration nicht manuell einrichten oder einen Linter in Ihren Workflow integrieren.<\/p>","protected":false},"excerpt":{"rendered":"Einleitung Vielleicht haben Sie bereits mit TypeScript gearbeitet, beispielsweise im Rahmen eines Starterprojekts oder mit einem Tool wie der Angular CLI\u2026","protected":false},"author":1,"featured_media":15191,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_yoast_wpseo_focuskw":"","_yoast_wpseo_title":"","_yoast_wpseo_metadesc":"","_yoast_wpseo_canonical":"","_yoast_wpseo_opengraph-description":"","_yoast_wpseo_opengraph-image":"","_yoast_wpseo_twitter-description":"","_yoast_wpseo_twitter-image":"","_yoast_wpseo_focuskeywords":"","_yoast_wpseo_primary_category":"193","footnotes":""},"categories":[193,363],"tags":[416,366],"class_list":{"0":"post-15190","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-tutorials","8":"category-programming","9":"tag-typescript","10":"tag-366"},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>\u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 TypeScript \u062c\u062f\u06cc\u062f \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u0645 - \u0628\u0644\u0627\u06af ITPiran<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.itpiran.net\/blog\/de\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 TypeScript \u062c\u062f\u06cc\u062f \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u0645 - \u0628\u0644\u0627\u06af ITPiran\" \/>\n<meta property=\"og:description\" content=\"\u0645\u0642\u062f\u0645\u0647 \u0645\u0645\u06a9\u0646 \u0627\u0633\u062a \u0642\u0628\u0644\u0627\u064b \u0647\u0646\u06af\u0627\u0645 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 \u0634\u0631\u0648\u0639 \u06cc\u0627 \u0627\u0628\u0632\u0627\u0631\u06cc \u0645\u0627\u0646\u0646\u062f Angular CLI \u0628\u0627 TypeScript \u06a9\u0627\u0631&hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.itpiran.net\/blog\/de\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/\" \/>\n<meta property=\"og:site_name\" content=\"\u0628\u0644\u0627\u06af ITPiran\" \/>\n<meta property=\"article:published_time\" content=\"2024-04-01T13:38:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdn.itpiran.net\/2024\/04\/01170716\/Type-Script.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1793\" \/>\n\t<meta property=\"og:image:height\" content=\"1110\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"1\u00a0Minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/\"},\"author\":{\"name\":\"admin\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/person\\\/04ed27b919baca468a2273f8e4318f81\"},\"headline\":\"\u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 TypeScript \u062c\u062f\u06cc\u062f \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u0645\",\"datePublished\":\"2024-04-01T13:38:49+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/\"},\"wordCount\":108,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/04\\\/01170716\\\/Type-Script.jpg\",\"keywords\":[\"typeScript\",\"\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc\"],\"articleSection\":[\"\u0622\u0645\u0648\u0632\u0634\u06cc\",\"\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc\"],\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/\",\"name\":\"\u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 TypeScript \u062c\u062f\u06cc\u062f \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u0645 - \u0628\u0644\u0627\u06af ITPiran\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/04\\\/01170716\\\/Type-Script.jpg\",\"datePublished\":\"2024-04-01T13:38:49+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/#primaryimage\",\"url\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/04\\\/01170716\\\/Type-Script.jpg\",\"contentUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2024\\\/04\\\/01170716\\\/Type-Script.jpg\",\"width\":1793,\"height\":1110},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/tutorials\\\/typescript-new-projectstep-1-starting-the-typescript-project\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u0622\u0645\u0648\u0632\u0634\u06cc\",\"item\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/category\\\/tutorials\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"\u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 TypeScript \u062c\u062f\u06cc\u062f \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u0645\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/\",\"name\":\"\u0628\u0644\u0627\u06af ITPiran\",\"description\":\"\u0627\u062e\u0628\u0627\u0631 \u0648 \u0645\u0642\u0627\u0644\u0627\u062a \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#organization\",\"name\":\"\u0628\u0644\u0627\u06af \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646\",\"alternateName\":\"ITPIran Blog\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/cdn.itpiran.net\\\/2023\\\/12\\\/27150508\\\/cropped-ITPIRAN-BLOG-LOGO-2.png\",\"contentUrl\":\"https:\\\/\\\/cdn.itpiran.net\\\/2023\\\/12\\\/27150508\\\/cropped-ITPIRAN-BLOG-LOGO-2.png\",\"width\":512,\"height\":512,\"caption\":\"\u0628\u0644\u0627\u06af \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646\"},\"image\":{\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/#\\\/schema\\\/person\\\/04ed27b919baca468a2273f8e4318f81\",\"name\":\"admin\",\"url\":\"https:\\\/\\\/www.itpiran.net\\\/blog\\\/de\\\/author\\\/admin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Wie man ein neues TypeScript-Projekt startet \u2013 ITPiran-Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.itpiran.net\/blog\/de\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/","og_locale":"de_DE","og_type":"article","og_title":"\u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 TypeScript \u062c\u062f\u06cc\u062f \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u0645 - \u0628\u0644\u0627\u06af ITPiran","og_description":"\u0645\u0642\u062f\u0645\u0647 \u0645\u0645\u06a9\u0646 \u0627\u0633\u062a \u0642\u0628\u0644\u0627\u064b \u0647\u0646\u06af\u0627\u0645 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 \u0634\u0631\u0648\u0639 \u06cc\u0627 \u0627\u0628\u0632\u0627\u0631\u06cc \u0645\u0627\u0646\u0646\u062f Angular CLI \u0628\u0627 TypeScript \u06a9\u0627\u0631&hellip;","og_url":"https:\/\/www.itpiran.net\/blog\/de\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/","og_site_name":"\u0628\u0644\u0627\u06af ITPiran","article_published_time":"2024-04-01T13:38:49+00:00","og_image":[{"width":1793,"height":1110,"url":"https:\/\/cdn.itpiran.net\/2024\/04\/01170716\/Type-Script.jpg","type":"image\/jpeg"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"Verfasst von":"admin","Gesch\u00e4tzte Lesezeit":"1\u00a0Minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/#article","isPartOf":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/"},"author":{"name":"admin","@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/person\/04ed27b919baca468a2273f8e4318f81"},"headline":"\u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 TypeScript \u062c\u062f\u06cc\u062f \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u0645","datePublished":"2024-04-01T13:38:49+00:00","mainEntityOfPage":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/"},"wordCount":108,"commentCount":0,"publisher":{"@id":"https:\/\/www.itpiran.net\/blog\/#organization"},"image":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn.itpiran.net\/2024\/04\/01170716\/Type-Script.jpg","keywords":["typeScript","\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc"],"articleSection":["\u0622\u0645\u0648\u0632\u0634\u06cc","\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06cc\u0633\u06cc"],"inLanguage":"de","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/","url":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/","name":"Wie man ein neues TypeScript-Projekt startet \u2013 ITPiran-Blog","isPartOf":{"@id":"https:\/\/www.itpiran.net\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/#primaryimage"},"image":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn.itpiran.net\/2024\/04\/01170716\/Type-Script.jpg","datePublished":"2024-04-01T13:38:49+00:00","breadcrumb":{"@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/#primaryimage","url":"https:\/\/cdn.itpiran.net\/2024\/04\/01170716\/Type-Script.jpg","contentUrl":"https:\/\/cdn.itpiran.net\/2024\/04\/01170716\/Type-Script.jpg","width":1793,"height":1110},{"@type":"BreadcrumbList","@id":"https:\/\/www.itpiran.net\/blog\/tutorials\/typescript-new-projectstep-1-starting-the-typescript-project\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.itpiran.net\/blog\/"},{"@type":"ListItem","position":2,"name":"\u0622\u0645\u0648\u0632\u0634\u06cc","item":"https:\/\/www.itpiran.net\/blog\/category\/tutorials\/"},{"@type":"ListItem","position":3,"name":"\u0686\u06af\u0648\u0646\u0647 \u06cc\u06a9 \u067e\u0631\u0648\u0698\u0647 TypeScript \u062c\u062f\u06cc\u062f \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u06cc\u0645"}]},{"@type":"WebSite","@id":"https:\/\/www.itpiran.net\/blog\/#website","url":"https:\/\/www.itpiran.net\/blog\/","name":"ITPiran Blog","description":"Iranische Nachrichten und Artikel zum Thema nachhaltiger Handel","publisher":{"@id":"https:\/\/www.itpiran.net\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.itpiran.net\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Organization","@id":"https:\/\/www.itpiran.net\/blog\/#organization","name":"Nachhaltiger iranischer Unternehmensblog","alternateName":"ITPIran Blog","url":"https:\/\/www.itpiran.net\/blog\/","logo":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/cdn.itpiran.net\/2023\/12\/27150508\/cropped-ITPIRAN-BLOG-LOGO-2.png","contentUrl":"https:\/\/cdn.itpiran.net\/2023\/12\/27150508\/cropped-ITPIRAN-BLOG-LOGO-2.png","width":512,"height":512,"caption":"\u0628\u0644\u0627\u06af \u062a\u062c\u0627\u0631\u062a \u067e\u0627\u06cc\u062f\u0627\u0631 \u0627\u06cc\u0631\u0627\u0646\u06cc\u0627\u0646"},"image":{"@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.itpiran.net\/blog\/#\/schema\/person\/04ed27b919baca468a2273f8e4318f81","name":"Administrator","url":"https:\/\/www.itpiran.net\/blog\/de\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/posts\/15190","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/comments?post=15190"}],"version-history":[{"count":1,"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/posts\/15190\/revisions"}],"predecessor-version":[{"id":15192,"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/posts\/15190\/revisions\/15192"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/media\/15191"}],"wp:attachment":[{"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/media?parent=15190"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/categories?post=15190"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.itpiran.net\/blog\/de\/wp-json\/wp\/v2\/tags?post=15190"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}