{"id":4441,"date":"2022-10-24T14:52:35","date_gmt":"2022-10-24T18:52:35","guid":{"rendered":"https:\/\/ionic.io\/blog\/?p=4441"},"modified":"2022-10-24T14:52:35","modified_gmt":"2022-10-24T18:52:35","slug":"announcing-stencil-2-19-0","status":"publish","type":"post","link":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0","title":{"rendered":"Announcing Stencil 2.19.0"},"content":{"rendered":"<p>Hey folks! We&#8217;re excited to share that Stencil v2.19.0 is here! This is a minor release and should be a drop-in replacement for existing projects. There are a few bug fixes in this release as well as some new features that folks may be excited about. Let&#8217;s dive in.<\/p>\n<p><!--more--><\/p>\n<h2>ES2022+ Compilation<\/h2>\n<p>Previously when trying to target ESNext or ES2022, some changes in TypeScript&#8217;s compiler that had been introduced a while ago, would cause <code>@State<\/code> to misbehave. Basically, any <code>@State<\/code> members would no longer trigger a re-render of your component. After some research into what happened, this has been fixed! So if you were following <a href=\"https:\/\/github.com\/ionic-team\/stencil\/issues\/3130\">#3130<\/a> on GitHub, it&#8217;s time to celebrate!.<\/p>\n<h2>Markdown Improvements<\/h2>\n<p>One of the best features of Stencil (aside from the compiler) is the built-in documentation tooling that is part of the build process. While you build your components, Stencil will generate the documentation based on the component itself, as well as various JSDoc comments within the component. But if you wanted to include some content before the component as a sort of overview, this wouldn&#8217;t be included in the docs output. Thankfully, this has been resolved in v2.19. So a component like this:<\/p>\n<pre><code class=\"language-typescript\">\/**\n* This is my component\n* @slot someSlot - Slot desc\n* @part partName - Part desc\n*\/\n@Component({ ... })\nexport class MyComponent {...}\n<\/code><\/pre>\n<p>The generated documentation will be<\/p>\n<pre><code class=\"language-markdown\"># my-component\n## Overview\nThis is my component<\/code><\/pre>\n<p>&nbsp;<\/p>\n<p>And that&#8217;s all for now! For a complete list of bug fixes, check out the <a href=\"https:\/\/github.com\/ionic-team\/stencil\/releases\/tag\/v2.19.0\">Stencil v2.19.0 release notes here<\/a>. Cheers!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hey folks! We&#8217;re excited to share that Stencil v2.19.0 is here! This is a minor release and should be a drop-in replacement for existing projects. There are a few bug fixes in this release as well as some new features that folks may be excited about. Let&#8217;s dive in.<\/p>\n","protected":false},"author":5,"featured_media":4443,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"publish_to_discourse":"1","publish_post_category":"21","wpdc_auto_publish_overridden":"","wpdc_topic_tags":"","wpdc_pin_topic":"","wpdc_pin_until":"","discourse_post_id":"554547","discourse_permalink":"https:\/\/forum.ionicframework.com\/t\/announcing-stencil-2-19-0\/227965","wpdc_publishing_response":"","wpdc_publishing_error":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[223],"tags":[98,76],"class_list":["post-4441","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-stencil","tag-release","tag-stencil"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v23.0 (Yoast SEO v23.0) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Announcing Stencil 2.19.0 - Ionic Blog<\/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:\/\/ionic.io\/blog\/announcing-stencil-2-19-0\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Announcing Stencil 2.19.0\" \/>\n<meta property=\"og:description\" content=\"Hey folks! We&#8217;re excited to share that Stencil v2.19.0 is here! This is a minor release and should be a drop-in replacement for existing projects. There are a few bug fixes in this release as well as some new features that folks may be excited about. Let&#8217;s dive in.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0\" \/>\n<meta property=\"og:site_name\" content=\"Ionic Blog\" \/>\n<meta property=\"article:published_time\" content=\"2022-10-24T18:52:35+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"880\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Mike Hartington\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@mhartington\" \/>\n<meta name=\"twitter:site\" content=\"@ionicframework\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Mike Hartington\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#article\",\"isPartOf\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0\"},\"author\":{\"name\":\"Mike Hartington\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/person\/c8c92b04d526adb925ea514c619a267b\"},\"headline\":\"Announcing Stencil 2.19.0\",\"datePublished\":\"2022-10-24T18:52:35+00:00\",\"dateModified\":\"2022-10-24T18:52:35+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0\"},\"wordCount\":228,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/ionic.io\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#primaryimage\"},\"thumbnailUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png\",\"keywords\":[\"release\",\"stencil\"],\"articleSection\":[\"Stencil\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0\",\"url\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0\",\"name\":\"Announcing Stencil 2.19.0 - Ionic Blog\",\"isPartOf\":{\"@id\":\"https:\/\/ionic.io\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#primaryimage\"},\"image\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#primaryimage\"},\"thumbnailUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png\",\"datePublished\":\"2022-10-24T18:52:35+00:00\",\"dateModified\":\"2022-10-24T18:52:35+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#primaryimage\",\"url\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png\",\"contentUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png\",\"width\":1600,\"height\":880,\"caption\":\"A featured image for the Stencil 2.19.0 release.\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/ionic.io\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Announcing Stencil 2.19.0\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/ionic.io\/blog\/#website\",\"url\":\"https:\/\/ionic.io\/blog\/\",\"name\":\"ionic.io\/blog\",\"description\":\"Build amazing native and progressive web apps with the web\",\"publisher\":{\"@id\":\"https:\/\/ionic.io\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/ionic.io\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/ionic.io\/blog\/#organization\",\"name\":\"Ionic\",\"url\":\"https:\/\/ionic.io\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png\",\"contentUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png\",\"width\":1920,\"height\":854,\"caption\":\"Ionic\"},\"image\":{\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/x.com\/ionicframework\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/person\/c8c92b04d526adb925ea514c619a267b\",\"name\":\"Mike Hartington\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/ionic.io\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2018\/08\/mike-headshot-2-smaller-150x150.png\",\"contentUrl\":\"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2018\/08\/mike-headshot-2-smaller-150x150.png\",\"caption\":\"Mike Hartington\"},\"description\":\"Director of Developer Relations\",\"sameAs\":[\"https:\/\/twitter.com\/mhartington\",\"https:\/\/x.com\/mhartington\"],\"url\":\"https:\/\/ionic.io\/blog\/author\/mike\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Announcing Stencil 2.19.0 - Ionic 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:\/\/ionic.io\/blog\/announcing-stencil-2-19-0","og_locale":"en_US","og_type":"article","og_title":"Announcing Stencil 2.19.0","og_description":"Hey folks! We&#8217;re excited to share that Stencil v2.19.0 is here! This is a minor release and should be a drop-in replacement for existing projects. There are a few bug fixes in this release as well as some new features that folks may be excited about. Let&#8217;s dive in.","og_url":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0","og_site_name":"Ionic Blog","article_published_time":"2022-10-24T18:52:35+00:00","og_image":[{"width":1600,"height":880,"url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png","type":"image\/png"}],"author":"Mike Hartington","twitter_card":"summary_large_image","twitter_creator":"@mhartington","twitter_site":"@ionicframework","twitter_misc":{"Written by":"Mike Hartington","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#article","isPartOf":{"@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0"},"author":{"name":"Mike Hartington","@id":"https:\/\/ionic.io\/blog\/#\/schema\/person\/c8c92b04d526adb925ea514c619a267b"},"headline":"Announcing Stencil 2.19.0","datePublished":"2022-10-24T18:52:35+00:00","dateModified":"2022-10-24T18:52:35+00:00","mainEntityOfPage":{"@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0"},"wordCount":228,"commentCount":0,"publisher":{"@id":"https:\/\/ionic.io\/blog\/#organization"},"image":{"@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#primaryimage"},"thumbnailUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png","keywords":["release","stencil"],"articleSection":["Stencil"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#respond"]}]},{"@type":"WebPage","@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0","url":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0","name":"Announcing Stencil 2.19.0 - Ionic Blog","isPartOf":{"@id":"https:\/\/ionic.io\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#primaryimage"},"image":{"@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#primaryimage"},"thumbnailUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png","datePublished":"2022-10-24T18:52:35+00:00","dateModified":"2022-10-24T18:52:35+00:00","breadcrumb":{"@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#primaryimage","url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png","contentUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png","width":1600,"height":880,"caption":"A featured image for the Stencil 2.19.0 release."},{"@type":"BreadcrumbList","@id":"https:\/\/ionic.io\/blog\/announcing-stencil-2-19-0#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/ionic.io\/blog"},{"@type":"ListItem","position":2,"name":"Announcing Stencil 2.19.0"}]},{"@type":"WebSite","@id":"https:\/\/ionic.io\/blog\/#website","url":"https:\/\/ionic.io\/blog\/","name":"ionic.io\/blog","description":"Build amazing native and progressive web apps with the web","publisher":{"@id":"https:\/\/ionic.io\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/ionic.io\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/ionic.io\/blog\/#organization","name":"Ionic","url":"https:\/\/ionic.io\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png","contentUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2020\/10\/white-on-color.png","width":1920,"height":854,"caption":"Ionic"},"image":{"@id":"https:\/\/ionic.io\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/x.com\/ionicframework"]},{"@type":"Person","@id":"https:\/\/ionic.io\/blog\/#\/schema\/person\/c8c92b04d526adb925ea514c619a267b","name":"Mike Hartington","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ionic.io\/blog\/#\/schema\/person\/image\/","url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2018\/08\/mike-headshot-2-smaller-150x150.png","contentUrl":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2018\/08\/mike-headshot-2-smaller-150x150.png","caption":"Mike Hartington"},"description":"Director of Developer Relations","sameAs":["https:\/\/twitter.com\/mhartington","https:\/\/x.com\/mhartington"],"url":"https:\/\/ionic.io\/blog\/author\/mike"}]}},"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/ionic.io\/blog\/wp-content\/uploads\/2022\/10\/stencil2190-feature-image.png","_links":{"self":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts\/4441","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/comments?post=4441"}],"version-history":[{"count":0,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/posts\/4441\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/media\/4443"}],"wp:attachment":[{"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/media?parent=4441"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/categories?post=4441"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ionic.io\/blog\/wp-json\/wp\/v2\/tags?post=4441"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}