小编Boo*_*aar的帖子

我有一个带有 CSS 关键帧动画的沙漏 CSS 元素。动画的工作时间是无限的；在每次迭代结束时，它都会旋转到起始位置并继续工作。

我需要在单击按钮时重新启动动画。但不是立即重新启动，而是以非常快的速度加速到启动位置，然后再次开始正常工作。

我尝试单击以更改动画持续时间迭代计数的样式，但动画立即停止。结束动画事件使其正常工作，但它从最后一个位置开始。

const hourglass = document.querySelector(".hourglass")
const before = document.querySelector(".before")
const after = document.querySelector(".after")

const button = document.querySelector('button');

const handleClick = ()=>{
    hourglass.style.animationDuration = '1s';
  hourglass.style.animationIterationCount = 1
  
    before.style.animationDuration = '1s';
  before.style.animationIterationCount = 1
  
    after.style.animationDuration = '1s';
  after.style.animationIterationCount = 1
}

button.addEventListener('click',handleClick);

  hourglass.addEventListener('animationend', (event) => {
    setTimeout(()=>{
        hourglass.style.animationDuration = '8s';
  hourglass.style.animationIterationCount = "infinite";
  
    before.style.animationDuration = '8s';
  before.style.animationIterationCount = "infinite";
  
    after.style.animationDuration = '8s';
  after.style.animationIterationCount = "infinite";
    },1000)
    
  });

*
{
  border: 0;
  box-sizing: border-box;
  margin: 0; …

我正在尝试将Webpack Bundle Analyzer添加到我的 Next.js 应用程序中。我尝试next.config.js按如下方式更新我的：

const BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin;

const nextConfig = {
  reactStrictMode: true,
  swcMinify: true,
  plugins: [new BundleAnalyzerPlugin()],
};

module.exports = nextConfig;

但这引发了这个错误：

Invalid next.config.js options detected: The root value has an unexpected property, plugins, which is not in the list of allowed properties (amp, analyticsId, assetPrefix, basePath, cleanDistDir, compiler, compress, crossOrigin, devIndicators, distDir, env, eslint, excludeDefaultMomentLocales, experimental, exportPathMap, generateBuildId, generateEtags, headers, httpAgentOptions, i18n, images, modularizeImports, onDemandEntries, optimizeFonts, output, outputFileTracing, pageExtensions, poweredByHeader, productionBrowserSourceMaps, publicRuntimeConfig, …