vuejs / composition-api

Composition API plugin for Vue 2
https://composition-api.vuejs.org/
MIT License
4.19k stars 342 forks source link

Error "No vue dependency found" #544

Closed schl3ck closed 4 years ago

schl3ck commented 4 years ago

I get the following error upon loading the app in my browser:

vue-composition-api-error

I don't know why it suddenly popped up, but I didn't manage to load my app again since then.

You can find a repro with instructions here: https://github.com/schl3ck/vuejs-composition-api-issue-544

I think the issue is here in line 42. Shouldn't that be assert(constructor, `No vue dependency found.`)?

https://github.com/vuejs/composition-api/blob/5484bb7fec15dfa8ac316c5266ef3cf00820b1a0/src/runtimeContext.ts#L38-L46

In my case vueConstructor is falsey and vueDependency has a value.

dorianamouroux commented 4 years ago

I had the same issue, it's because you are declaring any reactive elements (ref() / reactive()) before the plugin is installed in your Vue instance.

You can fixing by calling Vue.use(VueCompositionAPI) before importing any of your components/store

schl3ck commented 4 years ago

Thanks for the hint.

Rearranging the imports didn't solve the error, but I got it working by importing the views dynamically instead of at the top of router/index.js.

ghost commented 3 years ago

I solved this problem by change version @vue/composition-api . 1) Please check the dependencies version compatible with @vue/composition-api . 2) Remove Node module package.json:

"dependencies": {
    "@casl/ability": "^5.3.1",
    "@casl/vue": "1.x",
    "@mdi/js": "^5.9.55",
    "@vuetify/cli-plugin-utils": "^0.0.9",
    "@vueuse/core": "^4.8.1",
    "apexcharts-clevision": "^3.28.3",
    "axios": "^0.21.1",
    "axios-mock-adapter": "^1.19.0",
    "chart.js": "2.9.4",
    "core-js": "^3.6.5",
    "firebase-functions": "^3.15.7",
    "jsonwebtoken": "^8.5.1",
    "leaflet": "^1.7.1",
    "prismjs": "^1.23.0",
    "vue": "^2.6.14",
    "vue-apexcharts": "^1.6.1",
    "vue-chartjs": "^3.5.1",
    "vue-i18n": "^8.24.5",
    "vue-prism-component": "1",
    "vue-router": "^3.5.2",
    "vue2-leaflet": "^2.7.1",
    "vue2-perfect-scrollbar": "^1.5.0",
    "vuedraggable": "^2.24.3",
    "vuetify": "^2.5.5",
    "vuex": "^3.4.0"
  },

package-lock.json:

"node_modules/@vue/composition-api": {
      "version": "1.0.4",
      "resolved": "https://registry.npmjs.org/@vue/composition-api/-/composition-api-1.0.4.tgz",
      "integrity": "sha512-3OzvW8RS7/7kxE+SDXm8zSLZRy9GtCYwyLYdnGtIsqXRSt5nWkA7zu80Cw8Vg+67jglrpMdVBBy7AUXAB34ZSw==",
      "optional": true,
      "peer": true,
      "dependencies": {
        "tslib": "^2.3.0"
      },
      "peerDependencies": {
        "vue": ">= 2.5 < 3"
      }
    },
"node_modules/vue-demi": {
      "version": "0.11.4",
      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.11.4.tgz",
      "integrity": "sha512-/3xFwzSykLW2HiiLie43a+FFgNOcokbBJ+fzvFXd0r2T8MYohqvphUyDQ8lbAwzQ3Dlcrb1c9ykifGkhSIAk6A==",
      "hasInstallScript": true,
      "bin": {
        "vue-demi-fix": "bin/vue-demi-fix.js",
        "vue-demi-switch": "bin/vue-demi-switch.js"
      },
      "engines": {
        "node": ">=12"
      },
      "funding": {
        "url": "https://github.com/sponsors/antfu"
      },
      "peerDependencies": {
        "@vue/composition-api": "^1.0.0-rc.1",
        "vue": "^3.0.0-0 || ^2.6.0"
      },
      "peerDependenciesMeta": {
        "@vue/composition-api": {
          "optional": true
        }
      }
    },
**Focus on here:**
"@vue/composition-api": {
      "version": "1.0.4",
      "resolved": "https://registry.npmjs.org/@vue/composition-api/-/composition-api-1.0.4.tgz",
      "integrity": "sha512-3OzvW8RS7/7kxE+SDXm8zSLZRy9GtCYwyLYdnGtIsqXRSt5nWkA7zu80Cw8Vg+67jglrpMdVBBy7AUXAB34ZSw==",
      "optional": true,
      "peer": true,
      "requires": {
        "tslib": "^2.3.0"
      }
    },

3) npm install

azamat-sharapov commented 2 years ago

This is happening starting release 1.0.1. I don't know what exactly is causing this, here are changes in that release: https://github.com/vuejs/composition-api/compare/v1.0.0...v1.0.1