小编Die*_*ego的帖子

我正在做一门课程，我们使用express-node postgres和react（使用typescript）和typeORM。到目前为止，一切都运行良好，但我面临 typeORM 的问题，我不知道发生了什么以及为什么会发生此错误

大问题：所以，问题是，我正在进行身份验证，并且在某些时候我们更改了数据库中的用户模式，因此我们必须进行迁移，但是，在迁移之前，我们做了，npm run typeorm schema:drop但是当我尝试时，这个发生在迁移过程中

这是我使用的第一个命令

npm run typeorm migration:generate -- --n create-users-table\n

这是错误

> new-typeorm-project@0.0.1 typeorm C:\\Users\\diego cifuentes\\Desktop\\Studying  Backend\\redit> ts-node ./node_modules/typeorm/cli.js "migration:generate" "create-users-table"\n\nbin.js migration:generate\n\nGenerates a new migration file with sql needs to be executed to update\nschema.\n\nOpciones:\n  -h, --help          Muestra ayuda                             [booleano]  -c, --connection    Name of the connection on which run a query.\n                                                      [defecto: "default"]  -n, --name          Name of the migration class.\n                                        [cadena de caracteres] [requerido]  -d, --dir           Directory …

我知道在 Next.js 中我们有 Image 组件，但我遇到的问题是我不能将它用作普通的 HTML 标签，如<img />. 我必须给它一个布局，但是没有选项可以将它作为普通的 HTML 标签进行控制，除此之外，我不能对它使用成帧器运动。

所以我刚刚安装，next-images所以我当然可以导入图像并使用它们，一切正常，直到我 npm run 构建登录页面以查看一些结果，并且有以下警告：

Failed to compile.

./components/Presentation/Presentation.js
77:13  Error: Do not use <img>. Use Image from 'next/image' instead. See https://nextjs.org/docs/messages/no-img-element.  @next/next/no-img-element

Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules

npm ERR! code ELIFECYCLE

这是我使用img带有样式组件的标签的地方：

<PresentationUnderText2 src="/underText-Presentation.png" alt="" />
<PresentationScissor2   src="/scissors.svg"alt=""/>

我该怎么做才能img正常使用标签？

在开发我的登陆页面（使用 next.js ）时，我决定使用这行代码作为一个部分的背景。

background-image: linear-gradient(to bottom, rgb(123, 8, 255, 0.9), rgb(123, 8, 255, 0.87)), url("/main background img.jpg");

但是，由于 next.js 允许您使用 Image 组件进行优化，因此我尝试以这种方式将相同的 img 作为背景

<PresentationHero2>
    {/* Background */}
    <Image
     src="/main background img.jpg"
     alt=""
     layout="fill"
     objectFit="cover"
     />
</PresentationHero2>

样式（带有样式组件）

export const PresentationHero2 = styles.div`

position: relative;

width: 100%;
height: 663px;
 
background: linear-gradient(to bottom, rgb(123, 8, 255, 0.9), rgb(123, 8, 255, 0.87));

display: flex; 
align-items: center;
justify-content: center;

overflow: hidden;

`;

一切正常，问题是我看不到线性渐变，那么，我如何使用图像组件但同时使用背景颜色？因为我唯一能看到的就是图像：/

我希望你能帮我解决这个问题。谢谢你的时间 ！

这是我第一次使用 next.js，我遇到了一些问题......

所以我只是正常地执行我的应用程序，我查看了开发工具，并且存在这个问题

现在，我的第一个想法是，好吧，我没有关闭 html 标签，我查看了我的导航栏和 AuthContext 组件，这不是问题，所以，我真的不知道发生了什么，我希望你能帮我解决这个问题。

让我向您展示组件

导航栏

import { NavbarHeader } from "./NavbarStyled";
import Part1 from "./Parts/Part1";
import Part2 from "./Parts/Part2";
import Part3 from "./Parts/Part3";

const Navbar = () => {
  if (typeof window !== "undefined") {
    var auth = JSON.parse(localStorage.getItem("Auth"));
  }
  return (
    <>
      {auth ? (
        <NavbarHeader>
          {/* Go home icon - search bar */}
          <Part1 />
          {/* Middle Icons */}
          <Part2 />
          {/* User information */}
          <Part3 />
        </NavbarHeader>
      ) : (
        <div></div>
      )} …

我想将数据传递到我的 useState 中，问题是，useEffect 无法很好地执行此操作......

这就是我所拥有的

const PublicationsHome = ({ data: allPubs }) => {
  // All pubs

  const { data: Publications }: thePublication = useSWR(
    `${process.env.URL}/api/publication`,
    {
      initialData: allPubs,
      revalidateOnFocus: false
    }
  );

  const [pubRequested, setPubRequested] = useState<Ipublication[]>([]);

  useEffect(() => {
      setPubRequested(Publications);
  }, []);

  console.log(pubRequested);

`;

  return ()
};

export const getStaticProps: GetStaticProps = async () => {
  const { data } = await axios.get(`${process.env.URL}/api/publication`);

  return {
    props: data
  };
};

export default PublicationsHome;

所以，逻辑很简单，我通过使用 getStaticProps 获取数据，即服务器端渲染，但我想使用 SWR 钩子，所以我使用initialData，这样我就可以使用它，最后的事情是，我正在使用 useEffect，我想将出版物数据从 …

我有这个打字稿界面，它作为我的 React 应用程序中 api 调用的通用结构。

export interface ICommonApiState {
    loading: boolean;
    data: any;
    serverError: string;
}

正如您所看到的，数据类型是any，但我希望该类型是动态的，因为我将在多个地方使用相同的接口，但我不想每次使用它时都创建一个新接口，那么，我如何根据我的需要将类型传递给数据？

例如，如果我对此服务器进行 api 调用，该调用将为我提供一组用户名，那么我如何使用相同的接口将该类型传递给数据？喜欢..

const [userNames, setUserNames] = useState<ICommonApiState<IUserNames>>(
{
 loading: false,
 serverError: '',
 data: [] -> **This receives inferred types from IUserNames**
}
)