带有 typescript web 组件的 Oracle-jet

Question

我已经使用 typescript run 创建了应用程序：

ojet create web-app-navbar --template=navbar --typescript

然后我创建了 web 组件运行：

ojet create components demo-card --typescript

ojet cli 已成功创建演示卡组件。 我想在 about 页面中添加演示卡组件，并且添加了 html 标签：

// IT IS about.ts
class AboutViewModel {

  constructor() {

  }

  /**
   * Optional ViewModel method invoked after the View is inserted into the
   * document DOM.  The application can put logic that requires the DOM being
   * attached here. 
   * This method might be called multiple times - after the View is created
   * and inserted into the DOM and after the View is reconnected
   * after being disconnected.
   */
  connected(): void {
    // implement if needed
  }

  /**
   * Optional ViewModel method invoked after the View is disconnected from the DOM.
   */
  disconnected(): void {
    // implement if needed
  }

  /**
   * Optional ViewModel method invoked after transition to the new View is complete.
   * That includes any possible animation between the old and the new View.
   */
  transitionCompleted(): void {
    // implement if needed
  }
}

export default AboutViewModel;

<!--
 Copyright (c) 2014, 2020, Oracle and/or its affiliates.
 The Universal Permissive License (UPL), Version 1.0
 -->
 <!-- IT IS about.html view -->
<div class="oj-hybrid-padding">
  <h1>About Content Area</h1>
  <div>
      To change the content of this section, you will make edits to the about.html file located in the /js/views folder.
  </div>
  <deno-card></deno-card>
</div>

但它没有显示在页面上。 如何将此组件添加到我的应用程序中？

Answer 1

将import 'demo-card/loader' 添加到about.ts

使用 ojet cli 时，系统会自动为您设置组件路径。 您需要添加import 'demo-card/loader' 以自动解析转译组件的正确路径。