title: Vue.use(plugin) not invoking the `install` function
body: <p>I am working on exporting my custom vue component as NPM module. I have followed steps mentioned in the official doc <a href="https://v2.vuejs.org/v2/cookbook/packaging-sfc-for-npm.html" rel="nofollow noreferrer">Packaging Vue Components for npm</a>.</p>
  <h2>My <code>index.js</code> AKA <code>wrapper.js</code> file:</h2>
  <pre class="lang-js prettyprint-override"><code>// index.js -&gt; wrapper.js
  
  // Import vue component
  import component from &quot;./components/VueOpenapiForm.vue&quot;;
  import ExtendSchema from &quot;./functional-components/extend-schema.js&quot;;
  // global components
  import ObjectForm from &quot;./components/ObjectForm.vue&quot;;
  import ArrayInput from &quot;./components/ArrayInput.vue&quot;;
  import KeyValuePairs from &quot;./components/KeyValuePairs.vue&quot;;
  import SimpleInput from &quot;./components/SimpleInput.vue&quot;;
  
  // export ExtendSchema
  export const extendSchema = ExtendSchema;
  
  // Declare install function executed by Vue.use()
  export function install(Vue) {
    if (install.installed) return;
    install.installed = true;
    Vue.component(&quot;VueOpenapiForm&quot;, component);
  
    Vue.component(&quot;object-form&quot;, ObjectForm);
    Vue.component(&quot;array-input&quot;, ArrayInput);
    Vue.component(&quot;key-value-pairs&quot;, KeyValuePairs);
    Vue.component(&quot;simple-input&quot;, SimpleInput);
  }
  
  // Create module definition for Vue.use()
  const plugin = {
    install
  };
  
  // Auto-install when vue is found (eg. in browser via &lt;script&gt; tag)
  let GlobalVue = null;
  if (typeof window !== &quot;undefined&quot;) {
    GlobalVue = window.Vue;
  } else if (typeof global !== &quot;undefined&quot;) {
    GlobalVue = global.Vue;
  }
  if (GlobalVue) {
    GlobalVue.use(plugin);
  }
  
  // To allow use as module (npm/webpack/etc.) export component
  export default component;
  
  </code></pre>
  <h2><code>rollup.config.js</code> file:</h2>
  <pre class="lang-js prettyprint-override"><code>// rollup.config.js
  import babel from &quot;rollup-plugin-babel&quot;;
  import resolve from &quot;@rollup/plugin-node-resolve&quot;;
  import commonjs from &quot;rollup-plugin-commonjs&quot;; // Convert CommonJS modules to ES6
  import vue from &quot;rollup-plugin-vue&quot;; // Handle .vue SFC files
  import buble from &quot;@rollup/plugin-buble&quot;; // Transpile/polyfill with reasonable browser support
  export default {
    input: &quot;src/index.js&quot;, // Path relative to package.json
    output: {
      name: &quot;VueOpenapiForm&quot;,
      exports: &quot;named&quot;
    },
    plugins: [
      resolve(),
      commonjs({
        namedExports: {
          // left-hand side can be an absolute path, a path
          // relative to the current directory, or the name
          // of a module in node_modules
          &quot;vue-codemirror&quot;: [&quot;codemirror&quot;]
        }
      }),
  
      babel({
        runtimeHelpers: true,
        exclude: &quot;node_modules/**&quot;,
        plugins: [
          &quot;@babel/plugin-external-helpers&quot;,
          &quot;@babel/plugin-transform-runtime&quot;
        ]
      }),
      vue({
        css: true, // Dynamically inject css as a &lt;style&gt; tag
        compileTemplate: true // Explicitly convert template to render function,
      }),
      buble() // Transpile to ES5
    ]
  };
  </code></pre>
  <h2>package.json</h2>
  <pre class="lang-json prettyprint-override"><code>{
    &quot;name&quot;: &quot;@appscode/vue-openapi-form&quot;,
    &quot;version&quot;: &quot;0.1.0&quot;,
    &quot;main&quot;: &quot;dist/vue-openapi-form.umd.js&quot;,
    &quot;module&quot;: &quot;dist/vue-openapi-form.esm.js&quot;,
    &quot;unpkg&quot;: &quot;dist/vue-openapi-form.min.js&quot;,
    &quot;browser&quot;: {
      &quot;./sfc&quot;: &quot;src/vue-openapi-form.vue&quot;
    },
    &quot;scripts&quot;: {
      &quot;serve&quot;: &quot;vue-cli-service serve&quot;,
      &quot;build&quot;: &quot;vue-cli-service build&quot;,
      &quot;lint&quot;: &quot;vue-cli-service lint&quot;,
      &quot;pkg&quot;: &quot;npm run pkg:umd &amp; npm run pkg:es &amp; npm run pkg:unpkg&quot;,
      &quot;pkg:umd&quot;: &quot;rollup --config pkg/rollup.config.js --format umd --file dist/vue-openapi-form.umd.js&quot;,
      &quot;pkg:es&quot;: &quot;rollup --config pkg/rollup.config.js --format es --file dist/vue-openapi-form.es.js&quot;,
      &quot;pkg:unpkg&quot;: &quot;rollup --config pkg/rollup.config.js --format iife --file dist/vue-openapi-form.min.js&quot;
    },
    &quot;dependencies&quot;: {
      &quot;@babel/runtime&quot;: &quot;^7.7.7&quot;,
      &quot;bulma&quot;: &quot;^0.8.0&quot;,
      &quot;bulma-switch&quot;: &quot;^2.0.0&quot;,
      &quot;core-js&quot;: &quot;^3.3.2&quot;,
      &quot;font-awesome&quot;: &quot;^4.7.0&quot;,
      &quot;vee-validate&quot;: &quot;^3.1.3&quot;,
      &quot;vue&quot;: &quot;^2.6.10&quot;,
      &quot;vue-codemirror&quot;: &quot;^4.0.6&quot;,
      &quot;vuex&quot;: &quot;^3.0.1&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;@babel/plugin-external-helpers&quot;: &quot;^7.7.4&quot;,
      &quot;@babel/plugin-transform-runtime&quot;: &quot;^7.7.6&quot;,
      &quot;@rollup/plugin-buble&quot;: &quot;^0.20.0&quot;,
      &quot;@rollup/plugin-node-resolve&quot;: &quot;^6.0.0&quot;,
      &quot;@vue/cli-plugin-babel&quot;: &quot;^4.0.0&quot;,
      &quot;@vue/cli-plugin-eslint&quot;: &quot;^4.0.0&quot;,
      &quot;@vue/cli-service&quot;: &quot;^4.0.0&quot;,
      &quot;@vue/eslint-config-prettier&quot;: &quot;^5.0.0&quot;,
      &quot;babel-cli&quot;: &quot;^6.26.0&quot;,
      &quot;babel-eslint&quot;: &quot;^10.0.3&quot;,
      &quot;eslint&quot;: &quot;^5.16.0&quot;,
      &quot;eslint-plugin-prettier&quot;: &quot;^3.1.1&quot;,
      &quot;eslint-plugin-vue&quot;: &quot;^5.0.0&quot;,
      &quot;node-sass&quot;: &quot;^4.12.0&quot;,
      &quot;prettier&quot;: &quot;^1.18.2&quot;,
      &quot;rollup&quot;: &quot;^1.17.0&quot;,
      &quot;rollup-plugin-babel&quot;: &quot;^4.3.3&quot;,
      &quot;rollup-plugin-commonjs&quot;: &quot;^10.0.1&quot;,
      &quot;rollup-plugin-uglify-es&quot;: &quot;0.0.1&quot;,
      &quot;rollup-plugin-vue&quot;: &quot;^5.0.1&quot;,
      &quot;sass-loader&quot;: &quot;^8.0.0&quot;,
      &quot;vue-template-compiler&quot;: &quot;^2.6.10&quot;
    },
    &quot;description&quot;: &quot;A Vue component to generate html form using OpenAPI v3 schema&quot;,
    &quot;repository&quot;: {
      &quot;type&quot;: &quot;git&quot;,
      &quot;url&quot;: &quot;git+https://github.com/appscode/vue-openapi-form.git&quot;
    },
    &quot;keywords&quot;: [
      &quot;json-schema&quot;,
      &quot;vue&quot;,
      &quot;openapi&quot;,
      &quot;kubernetes&quot;
    ],
    &quot;author&quot;: &quot;support@appscode.com&quot;,
    &quot;license&quot;: &quot;Apache-2.0&quot;,
    &quot;bugs&quot;: {
      &quot;url&quot;: &quot;https://github.com/appscode/vue-openapi-form/issues&quot;
    },
    &quot;homepage&quot;: &quot;https://github.com/appscode/vue-openapi-form#readme&quot;
  }
  </code></pre>
  <hr />
  <p>When I run <code>npm run pkg</code> rollup bundles the component and produces 3 files in the dist folder.</p>
  <ul>
  <li>vue-openapi-form.es.js</li>
  <li>vue-openapi-form.min.js</li>
  <li>vue-openapi-form.umd.js</li>
  </ul>
  <hr />
  <p>Now, I am trying import this bundled component inside a different Vue project. In the new project in <code>main.js</code> file:</p>
  <pre class="lang-js prettyprint-override"><code>// main.js
  ...
  
  import VueOpenapiForm from &quot;@appscode/vue-openapi-form&quot;
  Vue.use(VueOpenapiForm)
  
  ...
  </code></pre>
  <p>Now, when I try to use <code>vue-openapi-form</code> as <code>html</code> tag inside vue template. I have the following error</p>
  <pre><code>[Vue warn]: Unknown custom element: &lt;vue-openapi-form&gt; - did you register the component correctly? For recursive components, make sure to provide the &quot;name&quot; option.
  
  found in
  
  ---&gt; &lt;App&gt; at src/App.vue
  </code></pre>
  <hr />
  <p>Can anyone tell me what am I doing wrong here ?
  I need all those components to be declared globally as they are recursive. The install function does just that but it is not being called when I use <code>Vue.use</code>. How can I solve this ?</p>