I have an issue that I cant solve. Writing pure js application and then have a error:

Uncaught TypeError: Cannot read properties of undefined (reading 'components')
    at new Excel (Excel.js:4:31)
    `at Header._createSuperInternal` (Formula.js:3:1)
    at new Header (Header.js:3:1)
    at Excel.js:11:25
    at Array.forEach (<anonymous>)
    at Excel.getRoot (Excel.js:10:21)
    at Excel.render (Excel.js:19:26)
    at Module../index.js (index.js:12:7)
    at __webpack_require__ (bootstrap:24:1)
    at startup:7:1

My code at Excel.js:

       export class Excel {
      constructor(selector, options) {
        this.$el = document.querySelector(selector)
        this.components = options.components || []
      }
    
      getRoot() {
        const $root = document.createElement('div')
    
        this.components.forEach(Component => {
          const component = new Component()
          $root.insertAdjacentHTML('beforeend', component.toHTML())
        })
    
        return $root
      }
    
      render() {
        this.$el.append(this.getRoot())
      }

} 

at Formula.js for example i tried to render some text in pages, code:

        import {Excel} from '../excel/Excel'
    
    export class Formula extends Excel {
      toHTML() {
        return '<h1>Formula</h1>'
      }
    }