カスタムコンポーネント - js文字列リテラルとして定義されたhtmlテンプレートをクローンする方法？

Question

私は、バニラWebコンポーネントのさまざまな部分がどのように連携しているかを理解しようとしています。私は単純なカスタムコンポーネントを定義し、テンプレートを含めることを試みています。私はこれをやっているのは、多くのブラウザベンダーがHTMLのインポートをサポートしておらず、代わりにes6モジュールを使用しているからです。

​​

私が手にエラーがキャッチされないタイプエラーです：cloneNodeを、私はそれは私が文字列として私のテンプレートを定義しています方法とは何かを持っている想像機能 ではありませんここに私のWebコンポーネントです。

私の質問は次のとおりです。テンプレートがJavaScript文字列リテラルとして定義されているカスタムコンポーネントでテンプレートをスタンプするにはどうすればよいですか？追加の依存関係やnpmライブラリを使わなくてもそれを行うことはできますか？

Answer 1

https://developer.mozilla.org/en-US/docs/Web/API/Node/cloneNodecloneNodeは、Nodeインターフェイス上にある方法です。

tmplは、Nodeではなく、stringです。あなたはあなたのコードの先頭にこのような何かをする必要があり

：

let tmpl = document.createElement('template'); 
tmpl.innerHTML = ` 
<h1>header</h1> 
<p>copy</p> 
`;