小编Mar*_*ius的帖子

执行此操作时，yarn install我收到此错误，但其他项目没有问题，也使用 Brew 安装节点。请注意我还应该尝试什么，有什么建议吗？

error */node_modules/node-sass: Command failed.
Exit code: 1
Command: node scripts/build.js
Arguments: 
Directory: */node_modules/node-sass
Output:
Building: /opt/homebrew/Cellar/node@14/14.18.1/bin/node */node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
gyp info it worked if it ends with ok
gyp verb cli [
gyp verb cli   '/opt/homebrew/Cellar/node@14/14.18.1/bin/node',
gyp verb cli   '*/node_modules/node-gyp/bin/node-gyp.js',
gyp verb cli   'rebuild',
gyp verb cli   '--verbose',
gyp verb cli   '--libsass_ext=',
gyp verb cli   '--libsass_cflags=',
gyp verb cli   '--libsass_ldflags=',
gyp verb cli   '--libsass_library='
gyp verb cli ]
gyp info …

我正在尝试学习如何创建类似于此动画的内容：https : //dribbble.com/shots/5311359-Diprella-Login

所以目前我遇到的问题是当我的案例中的“绿色”或“蓝色”扩展>移动>收缩时，我无法使用“宽度”获得相同的效果，因为它从右侧收缩，我希望它从左侧收缩移动后的一侧。

附上我的 CodePen：https ://codepen.io/MariusZMM/pen/jJWebK

使用的JS：

var start = anime.timeline({
  easing: 'easeInOutSine',
  autoplay: false
});

start
  .add({
    targets: '.square',
    width: 600,
    duration: 500
  })
  .add(
    {
      targets: '.square',
      translateX: 400,
      duration: 500
    },
    '-=100'
  )
  .add({
    targets: '.square',
    width: 400,
    duration: 500
  });

document.querySelector('.btn').onclick = function() {
  start.play();
  if (start.began) {
    start.reverse();
  }
};

我也尝试过使用 Padding 但我认为 AnimeJS 不喜欢值 0 0 0 300px

开始使用 ESLint 并遇到了 PropType 的几个问题，目前我有一个 prop children，现在假设这个 prop 是一个string. 我收到一个错误'children' is missing in props validationeslint(react/prop-types)，为了解决这个问题，我只是PropTypes这样使用：

CartProvider.propTypes = {
  children: PropTypes.string,
}

上面解决了问题，然后我又遇到了另一个问题propType "children" is not required, but has no corresponding defaultProps declaration.eslint(react/require-default-props)

因此，为了解决这个问题，我添加了另一个 PropType，如下所示：

CartProvider.defaultProps = {
  children: PropTypes.string,
}

所以我的理解是，每次使用道具时，我都需要使用propType和defaultProps。好吧，这解决了基于 prop 的问题string。但实际上这个道具是一个array然后array我得到了其他问题Prop typearray is forbiddeneslint(react/forbid-prop-types)。

请帮助我理解为什么 ESLint 将这些 props 标记为错误，我知道如何禁用它，但我想了解为什么会发生这种情况，然后编写更好的代码。

这是一个示例项目：

购物车上下文

import React from 'react'
import PropTypes …

在浏览器中获取错误 Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()

我的代码：

import { yupResolver } from '@hookform/resolvers/yup'
import { useState } from 'react'
import { SubmitHandler, useForm } from 'react-hook-form'
import { contactSchema } from 'schemas/schemas'
import { InputFloatLabel } from './components/Inputs/InputFloatLabel'

type TypeFormInput = {
  name: string
  email: string
  textarea: string
}

export const Register = () => {
  const [isLoading, setIsLoading] = useState(false)

  const {
    register,
    handleSubmit,
    formState: …

我正在尝试让 React Native Expo 与 Pnpm 一起运行，但是遇到了这个问题

使用 Npm 或 Yarn 没有问题。