在我们的项目中,我们之前一直在使用 Thymeleaf,但现在我们转向 Vue.js,我们在使用相同的广告脚本时遇到了一些问题。脚本看起来像这样。我只更改了网址。
<script data-adfscript="sub.adcompany.net/asdf/?id=256746"></script>
<script src="//sub.adcompany.net/url/to/advertisement/script.js" async="async" defer="defer"></script>
如果我们将这些标签放在 <template>
中,Webpack 会给出以下消息:
模板应该只负责将状态映射到 UI。避免在模板中放置具有副作用的标签,例如 ,因为它们不会被解析。
所以我一直在谷歌上搜索以找到类似的案例。有一些插件可以为 Google Ads 执行此操作,但它们对我们不起作用。转义脚本标签 <\/script>
以某种方式工作,但脚本直到加载 后才 添加到 DOM,因此它不会运行。
有没有人遇到过类似的问题?如果是这样,您的解决方案是什么?
Vue 文件看起来像这样:
<template>
<aside class="sidebar-ad ui-wide">
<script data-adfscript="sub.adcompany.net/asdf/?id=256746"></script>
<script src="//sub.adcompany.net/url/to/advertisement/script.js" async="async" defer="defer"></script>
</aside>
</template>
<script>
export default {
data () {
return {}
}
}
</script>
原文由 Watercolours 发布,翻译遵循 CC BY-SA 4.0 许可协议
有一个解决方法。也适用于
style
标签。