Next.jsでコンポーネントをインポートすることができません
解決したいこと
vsコードで、Next.jsでコンポーネントをインポートするとエラーになってしまいます。対処法を教えていただきたいです。
発生している問題・エラー
以下はapp/page.tsxのコードです。
'../components/TestComponent';に波線がついています。
import React from 'react';
import TestComponent from '../components/TestComponent';
const HomePage: React.FC = () => {
return (
<div>
<h1>Welcome to the Next.js App</h1>
<TestComponent/>
</div>
);
};
export default HomePage;
コンポーネント(components/TestComponent)のコード
import React from 'react';
type TestComponentProps = {
};
const TestComponent: React.FC<TestComponentProps> = () => {
return (
<div>
<h1>Hello, Next.js!</h1>
<p>This is a test component.</p>
</div>
);
};
export default TestComponent;
ブラウザに表示されているメッセージ
自分で試したこと
ファイル、ディレクトリのパスのスペルミスはありません。ダイナミックインポートを試してみましたが駄目でした。
0
