How use a custom define Module ‘如何使用自定义组件’

[cwwjsyc]

As the Guides from Quill.js offical Site : https://quilljs.com/guides/building-a-custom-module/ I make a module file like:

import Quill from 'quill'
class Counter {
  constructor(quill, options) {
    this.quill = quill;
    this.options = options;
    this.container = document.querySelector(options.container);
    quill.on('text-change', this.update.bind(this));
    this.update();  // Account for initial contents
  }

  calculate() {
    let text = this.quill.getText();
    if (this.options.unit === 'word') {
      text = text.trim();
      // Splitting empty text returns a non-empty array
      return text.length > 0 ? text.split(/\s+/).length : 0;
    } else {
      return text.length;
    }
  }

  update() {
    var length = this.calculate();
    var label = this.options.unit;
    if (length !== 1) {
      label += 's';
    }
    this.container.innerText = length + ' ' + label;
  }
}

Quill.register('modules/counter', Counter);

And then in EditorComponet Use like:

import Quill from 'quill'
import { Counter } from '../plugins/counter.js'
Quill.register('modules/counter ', Counter )

But when get the Object by: this.$refs.myQuillEditor.quill.getModule('counter')

this was undefined ? Why ? and how to resolve this?