如何使用此脚本将Mailer Lite安装在NUXT中弹出？错误窗口未定义

Question

我想在nuxt.js应用程序上安装此弹出窗口 我的问题是？ 如果我想在我的页面上添加此脚本，并且错误是窗口没有定义

如何将此弹出添加到我的应用程序nuxt.js？

  <!-- MailerLite Universal -->
<script>
(function(m,a,i,l,e,r){ m['MailerLiteObject']=e;function f(){
var c={ a:arguments,q:[]};var r=this.push(c);return "number"!=typeof r?r:f.bind(c.q);}
f.q=f.q||[];m[e]=m[e]||f.bind(f.q);m[e].q=m[e].q||f.q;r=a.createElement(i);
var _=a.getElementsByTagName(i)[0];r.async=1;r.src=l+'?v'+(~~(new Date().getTime()/1000000));
_.parentNode.insertBefore(r,_);})(window, document, 'script', 'https://static.mailerlite.com/js/universal.js', 'ml');

var ml_account = ml('accounts', '3587348', 'o8w2i6n0n5', 'load');
</script>
<!-- End MailerLite Universal -->

以我的错误

窗口未定义

pages/document.js:16:
Object../pages/document.js
webpack/bootstrap:25:
__webpack_require__
pages/index.js:24:76
Module../node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./pages/index.vue?vue&type=script&lang=js&
webpack/bootstrap:25:
__webpack_require__
webpack/bootstrap:25:
__webpack_require__
pages/index.vue:1:
Module../pages/index.vue
webpack/bootstrap:25:
__webpack_require__
async server.js:2289:21

Answer 1

nuxt3是 ssr ，这意味着它在服务器端渲染，并且在服务器和NUXT上没有窗口显示此错误，因此您应该在使用此process.client。

例如 ：

if(process.client){
  window.addEventListener();
} 
// => success :)