Vue-GTM错误:您可能需要一个适当的加载程序来处理该文件类型

我使用的是@gtm-support/vue2-gtm"; "^1.0.0"在我的一个Vue-2应用程序中，Vue版本如下:

"vue": "^2.5.2",
"vue-cookies": "^1.5.4",
"vue-i18n": "^8.0.0",
"vue-recaptcha": "^1.1.1",
"vue-router": "^3.0.1",
"vue-scrollto": "^2.17.1",
"vue-session": "^1.0.0",
"vuex": "^3.0.1"

对于Webpack和Vue-Loader:

"babel-core": "^6.22.1",
"babel-eslint": "^7.2.3",
"babel-loader": "^7.1.1",
"dotenv-webpack": "^4.0.0",
"vue-loader": "^13.3.0",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-dev-server": "^2.9.1",
"webpack-hot-middleware": "^2.22.3",
"webpack-merge": "^4.1.0"

现在，当我启动应用程序时，我得到以下错误:

ERROR  Failed to compile with 2 errors                                                                                                                                                                                                                                3:45:02 PM
error  in ./node_modules/@gtm-support/core/lib/utils.js
Module parse failed: Unexpected token (30:8)
You may need an appropriate loader to handle this file type.
|     const queryString = new URLSearchParams({
|         id,
|         ...((_c = config.queryParams) !== null && _c !== void 0 ? _c : {})
|     });
|     script.src = `https://www.googletagmanager.com/gtm.js?${queryString}`;
@ ./node_modules/@gtm-support/core/lib/index.js 9:14-32
@ ./node_modules/@gtm-support/vue2-gtm/dist/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8002 webpack/hot/dev-server ./src/main.js
error  in ./node_modules/@gtm-support/core/lib/gtm-support.js
Module parse failed: Unexpected token (44:12)
You may need an appropriate loader to handle this file type.
|             defer: false,
|             compatibility: false,
|             ...options
|         };
|         // @ts-expect-error: Just remove the id from options
@ ./node_modules/@gtm-support/core/lib/index.js 7:20-44
@ ./node_modules/@gtm-support/vue2-gtm/dist/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8002 webpack/hot/dev-server ./src/main.js

在main.js文件中。我有以下代码:

import VueGtm from '@gtm-support/vue2-gtm'
Vue.use(VueGtm, {
id: 'GTM-IDXX',
defer: false,
enabled: true,
debug: true,
loadScript: true
})

我有一个util.js文件，在那里我有跟踪事件的功能:

export default submitGTMEvents = (category, action, label) => {
if (label === undefined || label === '') label = window.location.href
const value = Number(store.getters.transactionId)
Vue.gtm.push({
event: null,
category: category,
action: action,
label: label,
value: value
})
}

我从组件中调用这个函数。我在这里使用1.0.0版本，因为其他版本也显示了同样的错误，并认为较早的版本有时会解决这个问题。

我一直面临同样的问题与@gtm-support/vue-gtm。

设置vue.config.js为我工作:

module.exports = { transpileDependencies: [ '@gtm-support/core' ] };

相关内容

最新更新

热门标签：