You can now import your new element as a JavaScript module, and use it in markup.
Starting code
my-element.js
{% include projects/try/use/before/index.html %}
{% include project.html folder="try/use/before" openFile="index.html" %}
Editing steps
If you're working locally, here's the syntax you'll need to use:
<head>
<script type="module" src="./my-element.js"></script>
</head>
<body>
<my-element></my-element>
</body>
In StackBlitz, scripts are managed slightly differently. In our live-editable code samples, a main script runs automatically and loads the module containing the custom element, so you won't need a <script>
tag for it in index.html
.
Add <my-element>
tags to index.html:
<body>
<!-- Add your element tags here -->
<my-element></my-element>
</body>
Completed code
index.html
{% include projects/try/use/after/index.html %}
{% include project.html folder="try/use/after" openFile="index.html" %}
{% include prevnext.html prevurl="create" prevtitle="Create an element" nexturl="properties" nexttitle="Declare properties" %}