【Next.js×TypeScript】_app.tsx内のMyAppの型定義でエラーが出る

Next.js

eslintを使用しているのですが、Next.jsの_app.tsx内でMyappのエラーが出ていました。その解消方法を記録します。

元のコード

({ Component, pageProps }: AppProps) =>に波線が引かれ、Missing return type on function. が表示されていました。

import { AppProps } from "next/app";
import "../styles/globals.css";
import React from "react";

const MyApp = ({ Component, pageProps }: AppProps) => {
  return <Component {...pageProps} />;
};

export default MyApp;

解決方法

: JSX.Element という型を与えることで解消しました。

import { AppProps } from "next/app";
import "../styles/globals.css";
import React from "react";

const MyApp = ({ Component, pageProps }: AppProps): JSX.Element => {
  return <Component {...pageProps} />;
};

export default MyApp;

タイトルとURLをコピーしました