mib200 / vue-gtm

Simple implementation of Google Tag Manager in Vue.js 2.0
Apache License 2.0
243 stars 85 forks source link

Cannot set property '$gtm' of undefined => Use vue-gtm: 3.0.0-vue2 without ~ or ^ #98

Closed popovdk closed 3 years ago

popovdk commented 3 years ago

When connecting to an application on Vue 2, an error occurs Uncaught TypeError: Cannot set property '$ gtm' of undefined due to the fact that the plugin is connected via Vue.config.globalProperties, and this is possible only in Vue 3

Installed simply through npm without specifying additional tags

Shinigami92 commented 3 years ago

Please use the vue-2 version of the plugin

Shinigami92 commented 3 years ago

@popovdk Please close this issue if this fixed your problem :slightly_smiling_face:

bastianaf commented 3 years ago

same issue here. This is my config

Vue.use(VueGtm, { id: 'GTM-SECRET', defer: false, enabled: true, debug: true, loadScript: true, trackOnNextTick: false, })

and got

image image

Shinigami92 commented 3 years ago

What do you have in your package.json?

Please try

{
  ...
  "dependencies": {
    ...
    "vue-gtm": "3.0.0-vue2"
  }
}

without ~ or ^ Then remove node_modules and reinstall

If you are using ~ or ^ and not the exact version you may fallback to the latest version, and this is the vue 3 branch :warning:


I can confirm that 3.0.0-vue2 is really the vue2 branch: https://unpkg.com/vue-gtm@3.0.0-vue2/dist/index.js

bastianaf commented 3 years ago

What do you have in your package.json?

Please try

{
  ...
  "dependencies": {
    ...
    "vue-gtm": "3.0.0-vue2"
  }
}

without ~ or ^ Then remove node_modules and reinstall

If you are using ~ or ^ and not the exact version you may fallback to the latest version, and this is the vue 3 branch ⚠️

I can confirm that 3.0.0-vue2 is really the vue2 branch: https://unpkg.com/vue-gtm@3.0.0-vue2/dist/index.js

this works for me, thanks a lot

mbence commented 3 years ago

Sorry guys, I'm a little confused: https://github.com/mib200/vue-gtm/compare/3.0.0-vue2...3.0.0

Anyway, I still get main.js?56d7:50 Uncaught TypeError: vue_gtm__WEBPACK_IMPORTED_MODULE_18___default(...) is not a function with Vue 2 and

    "vue-gtm": "3.0.0-vue2",
Shinigami92 commented 3 years ago

also please clear your node_modules and perform npm or yarn install again

wagslane commented 3 years ago

Can the requirement 3.0.0-vue2 be added to the docs?

Shinigami92 commented 3 years ago

Sure, if you want you can open a PR :) If not, I think I will add it tomorrow or so

Shinigami92 commented 3 years ago

@lane-c-wagner Added https://github.com/mib200/vue-gtm/commit/6f1577458199387d8dce9a3c6e4cae1aded318f9

AndrewBogdanovTSS commented 3 years ago

Is there any way to protect a use of ^ for -vue2 version? Right now it's very confusing behavior

Shinigami92 commented 3 years ago

If you know a strategy, please let me know! I'm not well into npm publishing

AndrewBogdanovTSS commented 3 years ago

@Shinigami92 you need to create 2 different packages for each project, that's the most common-sense solution. Plus your issues for different Vue versions won't mix up and it will all look more organized this way. I guess you can even use a package namespace, something similar to vue or nuxt is doing. e.g. @vue-gtm/vue-2 @vue-gtm/vue-3

Shinigami92 commented 3 years ago

For doing so, I need permission by the license owner @mib200 This is not my repo. If he give me permission to transfer everything to me or create an organization structure (in npm and github) and provide admin access, I can do it.

Currently I even don't have permission to protect the vue-2 branch ^^'

cartok commented 3 years ago

Can this be solved in a more generic way, so you would not need that additional layer?

cartok commented 3 years ago

What do you think about checking the vue version and depending on the result import() the code you need guys?

Shinigami92 commented 3 years ago

Without breaking TypeScript support? I don't think so.

If you have time to experiment with it, creating compatibility for Vue 2 and Vue 3 together, feel free to do so :slightly_smiling_face:

But in the (very) long-term this is irrelevant, as support for Vue 2 will one day be discontinued

antoci-alin commented 3 years ago

I'm also interested in a cleaner approach for this versioning.

KhozmoS commented 3 years ago

Hi guys, why dont put on the README.MD this important info: _Cannot set property '$gtm' of undefined => Use vue-gtm: 3.0.0-vue2 without ~ or ^

98_

Shinigami92 commented 3 years ago

@KhozmoS ... it is on the readme...

Oh, and beside that it's already there: this is an Open Source project, so you can create PRs for it, also for README.md So if you miss anything, feel free and I will make a review and merge it

KhozmoS commented 3 years ago

@Shinigami92 really don't know how I didn't see that... my bad 👌

Shinigami92 commented 3 years ago

We could try https://github.com/vueuse/vue-demi :thinking: