[英]Why is animejs throwing this error on build in the svelte-kit skeleton project?
I've installed animejs with npm using npm install animejs
我已经使用npm install animejs
用npm install animejs
<script>
import anime from 'animejs';
let heroTimeline = anime.timeline({autoplay: true});
let heroAnimation = {
targets: "#hero grow",
opacity: {
value: [0, 1],
duration: 800,
easing: 'easeOutExpo',
},
scale: {
value: [0, 1],
duration: 1000,
easing: 'easeOutElastic(1, .8)',
}
}
</script>
This code throws the following error:此代码引发以下错误:
ReferenceError: window is not defined
at makePromise (D:\Sync\Web\portfolio-website\node_modules\animejs\lib\anime.js:927:19)
at anime (D:\Sync\Web\portfolio-website\node_modules\animejs\lib\anime.js:933:17)
at Function.timeline (D:\Sync\Web\portfolio-website\node_modules\animejs\lib\anime.js:1264:12)
at index.svelte:4:39
at Object.$$render (D:\Sync\Web\portfolio-website\node_modules\svelte\internal\index.js:1684:22)
at Object.default (root.svelte:38:46)
at Object.default (/src/routes/__layout.svelte:12:50)
at eval (/src/lib/ThemeContext.svelte:46:41)
at Object.$$render (D:\Sync\Web\portfolio-website\node_modules\svelte\internal\index.js:1684:22)
at eval (/src/routes/__layout.svelte:11:100)
I also get the same error from importing from 'animejs/lib/anime.js'
and 'animejs/lib/anime.min.js'
.我也从'animejs/lib/anime.js'
和'animejs/lib/anime.min.js'
导入时得到同样的错误。 If I try importing from 'animejs/lib/anime.es.js'
I get the following error:如果我尝试从'animejs/lib/anime.es.js'
导入,我会收到以下错误:
D:\Sync\Web\portfolio-website\node_modules\animejs\lib\anime.es.js:1310
export default anime;
^^^^^^
SyntaxError: Unexpected token 'export'
at Object.compileFunction (node:vm:352:18)
at wrapSafe (node:internal/modules/cjs/loader:1031:15)
at Module._compile (node:internal/modules/cjs/loader:1065:27)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at nodeRequire (D:\Sync\Web\portfolio-website\node_modules\vite\dist\node\chunks\dep-85dbaaa7.js:66556:17)
at ssrImport (D:\Sync\Web\portfolio-website\node_modules\vite\dist\node\chunks\dep-85dbaaa7.js:66498:20)
Any ideas on how to fix it.关于如何修复它的任何想法。 Other than this the project is the default svelte skeleton project generated by svelte-kit.除此之外,该项目是由 svelte-kit 生成的默认 svelte 骨架项目。
Try to use onMount function for exemple:尝试使用 onMount 函数为例:
<script>
import { onMount } from 'svelte';
import anime from 'animejs';
onMount(() => {
let heroTimeline = anime.timeline({autoplay: true});
</script>
in onMount function you can use vanilla javascrpt在 onMount 函数中,您可以使用 vanilla javascrpt
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.