<p>How to share common <code>vue/nuxt</code>specific code between different packages? </p> <p>I don't want to use <code>monorepo</code>, but I have some shared code that I want to separate into its own package. This shared code (new package) is written using <code>@nuxtjs/composition-api</code> and is just a shared <code>computed</code> and <code> that is used over and over in different components/templates ;methods</code>. </p> <p>I do not want this package to be set up as a plugin. Instead, import directly to take advantage of tree shaking (just like <code>composition-api</code>). </p> <p>I am familiar with using <code>rollupjs</code> to create importable modules. </p> <pre class="brush:php;toolbar:false;">//New package //index.js export { default as isTrue } from './src/isTrue' ... //src/isTrue import { computed } from '@nuxtjs/composition-api' export default (p) => { return computed(() => p === 'true') //I'm not sure if this will destroy responsiveness? ! ? ! }</pre> <p>I had no problems compiling it to <code>.ssr, .esm, .min</code> formats via <code>rollupjs</code></p> <p>The problem occurs when I import a new package into a working file. </p> <pre class="brush:php;toolbar:false;">import { isTrue } from 'new-package' export default{ name: 'testComp', setup(props){ return { isActive: isTrue(props.active) } }</pre> <p> will produce: </p> <pre class="brush:php;toolbar:false;">[vue-composition-api] Vue.use(VueCompositionAPI) must be called before using any functions. </pre> <p>I understand that <code>@nuxtjs/composition-api</code> is a wrapper for VueCompositionAPI. </p> <p>I don’t want to install the new package as a plugin, so I omit the installation of the new package (installation example: https://github.com/wuruoyun/vue-component-lib-starter/blob/master/src/install .js)</p>

//library.js
export default function(){ // 访问 this -> 箭头函数没有 this
   return this.disabled == true // 当使用 options api 时，这将是 vue 上下文，即属性 disabled
}

//component.vue
import { isDisabled } from 'library'

export default {
  //Composition API:
  setup(props){
   return {
    //stuff
   }
  },
  //Options API:
  computed:{
    isDisabled,
  }
}