プロジェクト開いたら’@angular/core’型宣言エラー!対応策の備忘録

Angular

モジュール ‘@angular/core’ またはそれに対応する型宣言が見つかりません。
というエラーが出たので対応策を備忘録として残しておきます。

angularを久しぶりに触ったのでどのように対応したらいいのか少し詰まりました。
今回のケースは、ある講義の見本のプロジェクトをzipファイルでダウンロードし、解凍後Vscodeで開いたら上記のようなエラーが表示された次第です。

githubからクローンしたり、zipファイルでダウンロードしたりするケースでも対応は同じになります。



対応策としては、モジュールが見つからないのでそれを入れてあげればよいわけです。

モジュールをダウンロードする方法

先に結論を言うと下記のコマンドを行えば大丈夫です。


上記のコマンドを実行すると、プロジェクトのフォルダ内にある「package.json」ファイルの内容をもとにダウンロードが行われます。
例えば下記の画像の内容に沿ってダウンロードがはじまるわけです。

もう少し詳しく実際に作業しながら説明していきます。

まずはプロジェクトの階層に移動します。
今回のケースはプロジェクト名「cmp-databinding-start」です。

次に下記のコマンドを打ち込みます。
$npm install

上記の画像を見てもらうとわかりますが、なんだかたくさんエラーが出ますが、最終的になんとかなりますので、気にせずにいきましょう

今実行したコマンドの最後を見てみると、「found 4 vulnerabilities」つまり「4つの脆弱性が見つかりました」と表示されています。
下記の画像を見てもらうとわかりますが、
run npm audit fix to fix them, or npm audit for detailsと書かれていますので
$npm audit
を実行します。

$npm audit
を実行すると下記のような表示がされます。

上記の矢印のコマンドを順番に実行していきます。
参考に「npm install bootstrap@4.5.0」のケースの画像を載せておきます。

すべてのコマンドを実行して再度
$ npm audit
を実行します。すると脆弱性が0の表示になります。

これでモジュール ‘@angular/core’ またはそれに対応する型宣言が見つかりません。
というエラーはなくなっているはずです。
そして「node_modules」というフォルダができているはずです。
下記の画像を参考にしてください。

エラーが表示されなくなったことが確認できたらサーバーを起動してみます。
$npm start
コマンドを実行します。

途中でY/N (はい/いいえ)を聞かれるので「Yes」を入力します。
最後に「Compiled successfully.」になれば大丈夫です。

誰かのお役に立てられたら幸いです。

コメント

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