title: CKEditor 5 custom button fails in Vue.js component
body: <p>I implement the CKEditor5 from source in my Vue app. I use the  <strong>ckeditor5-editor-classic</strong> (following <a href="https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/vuejs.html#using-ckeditor-from-source" rel="nofollow noreferrer">this guide</a>) and want to add a custom button.  </p>
  
  <p>I followed this <a href="https://ckeditor.com/docs/ckeditor5/latest/framework/guides/creating-simple-plugin.html" rel="nofollow noreferrer">guide</a> and created a simple plugin to console.log on a  click of the button. That works just fine. </p>
  
  <p><strong>The problem:</strong> 
  The moment include my custom plugin, the <strong>Link</strong> and <strong>Table</strong> plugins start misbehaving that seems like a css positioning issue (renders the link field on the bottom of the page).</p>
  
  <p>My component looks like this: </p>
  
  <pre><code>&lt;template&gt;
      &lt;div&gt;
          &lt;ckeditor
                  v-model="body"
                  :editor="editor"
                  :config="editorConfig"&gt;
          &lt;/ckeditor&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      import CKEditor from '@ckeditor/ckeditor5-vue';
      import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
      import EssentialsPlugin from '@ckeditor/ckeditor5-essentials/src/essentials';
      import BoldPlugin from '@ckeditor/ckeditor5-basic-styles/src/bold';
      import LinkPlugin from '@ckeditor/ckeditor5-link/src/link';
      import MyCustomPlugin from '@/components/common/MyCustomPlugin';
  
      export default {
          components: {
              ckeditor: CKEditor.component,
          },
          data: function() {
              return {
                  editor: ClassicEditor,
                  editorConfig: {
                      plugins: [
                          EssentialsPlugin,
                          BoldPlugin,
                          LinkPlugin,
                      ],
                      extraPlugins: [MyCustomPlugin,],
                      toolbar: {
                          items: [
                              'bold',
                              'link',
                              'myCustomPlugin'
                          ]
                      }
                  },
  
              };
          },
      };
  &lt;/script&gt;
  </code></pre>
  
  <p>My <strong>vue.config.js</strong> file follows the guide. My custom plugin looks like this: </p>
  
  <pre><code>import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
  import imageIcon from '@ckeditor/ckeditor5-core/theme/icons/image.svg';
  import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
  
  class MyCustomPlugin extends Plugin {
      init() {
          const editor = this.editor;
  
          editor.ui.componentFactory.add( 'myCustomPlugin', locale =&gt; {
              const view = new ButtonView( locale );
  
              view.set( {
                  label: 'Insert image',
                  icon: imageIcon,
                  tooltip: true
              } );
  
              view.on( 'execute', () =&gt; {
                  console.log('dispatch some event');
              } );
  
              return view;
          } );
      }
  }
  
  export default MyCustomPlugin;
  
  </code></pre>
  
  <p>package.json looks like this: </p>
  
  <pre><code>    "@ckeditor/ckeditor5-basic-styles": "^11.0.0",
      "@ckeditor/ckeditor5-dev-utils": "^12.0.1",
      "@ckeditor/ckeditor5-dev-webpack-plugin": "^8.0.1",
      "@ckeditor/ckeditor5-editor-classic": "^12.0.0",
      "@ckeditor/ckeditor5-essentials": "^11.0.0",
      "@ckeditor/ckeditor5-font": "^10.0.4",
      "@ckeditor/ckeditor5-highlight": "^11.0.0",
      "@ckeditor/ckeditor5-link": "^11.0.0",
      "@ckeditor/ckeditor5-paragraph": "^11.0.0",
      "@ckeditor/ckeditor5-vue": "^1.0.0-beta.1",
  </code></pre>
  
  <p>The only indication I have is when <strong>ButtonView</strong> is not included, the Link seems to work properly. </p>
  
  <p>Otherwise no error messages. I haven't included the <strong>ckeditor5-build-classic</strong> anywhere else in the app.</p>
  
  <p>I have spent some few days on this issue and have tried everything the web has to offer, but cannot seem to find a way forward. Any help would be appreciated! </p>