Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Uncaught (in promise) TypeError: Cannot destructure property 'frames' of 'animation' as it is undefined. #390

Closed
EITSxiaozhai opened this issue Sep 15, 2024 · 2 comments

Comments

@EITSxiaozhai
Copy link

I'm coding with vue3+typeit, but when I remove node_modules and install typeit again, I get an error and this effect doesn't show up anymore. I don't know what it is.

import TypeIt from 'typeit'

const VerseGetting = async () => {
  try {
    const response = await fetch('https://v1.jinrishici.com/rensheng/shiguang');
    const data = await response.json();
    return data.content
  } catch (error) {
    console.error('Error fetching data:', error);
  }
};

const text = ref();

onMounted(async () => {
  fetchUvPvData();
  const content = await VerseGetting();
  new (TypeIt)(text.value, {
    strings: [content],
    cursorChar: "<span class='cursorChar'>|<span>",//用于光标的字符。HTML也可以
    speed: 100,
    lifeLike: true,// 使打字速度不规则
    cursor: true,//在字符串末尾显示闪烁的光标
    breakLines: false,// 控制是将多个字符串打印在彼此之上,还是删除这些字符串并相互替换
    loop: false,//是否循环
  }).go()
})


<h1 style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);" id="text" ref="text" class="msg"></h1>

It is in the F12 console and the full error displayed is the following message

index.es.js:828 Uncaught (in promise) TypeError: Cannot destructure property 'frames' of 'animation' as it is undefined.
    at TypeIt.attachCursor_fn (index.es.js:828:13)
    at TypeIt.go (index.es.js:535:5)
    at IndexPage.vue?t=1726389101925:178:6

Here is my pack.json

  "dependencies": {
    "@unhead/vue": "^1.8.9",
    "@vitejs/plugin-vue": "^4.3.4",
    "animate.css": "^4.1.1",
    "axios": "^1.6.0",
    "core-js": "^3.8.3",
    "element-plus": "^2.4.0",
    "fingerprintjs2": "^2.1.4",
    "grecaptcha": "^1.0.3",
    "jsonwebtoken": "^9.0.2",
    "lodash": "^4.17.21",
    "markdown-it": "^13.0.1",
    "os": "^0.1.2",
    "sass": "^1.70.0",
    "sass-loader": "^14.0.0",
    "typeit": "^8.7.1",
    "undraw-ui": "^1.2.1",
    "vite": "^4.5.0",
    "vue": "^3.2.25",
    "vue-jwt-decode": "^0.1.0",
    "vue-meta": "^3.0.0-alpha.2",
    "vue-recaptcha": "^3.0.0-alpha.2",
    "vue-router": "^4.0.13",
    "vue3-recaptcha2": "^1.8.0",
    "vuex": "^4.0.0",
    "vuex-persistedstate": "^4.1.0",
    "wow.js": "^1.2.2"
  },

The problem it has now is that it can't appear to work.

@alexmacarthur
Copy link
Owner

Found the issue! I'll get back to you later today with a fix. Thanks for letting me know.

alexmacarthur added a commit that referenced this issue Sep 15, 2024
@alexmacarthur
Copy link
Owner

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants