Node.js VSCodeエラーについて

Question

前提・実現したいこと

Progateに従って、Node.jsで買い物リストアプリを作っています。

〇〇.ejsの中で、<% %>を入力すると、vscode上、赤文字になり、localhostでもエラーメッセージが発生しました。下記２４行目等、複数同様の箇所。

発生している問題・エラーメッセージ、コード

TypeError: /Users/ryoto/Desktop/list-app/views/index.ejs:24
    22|         </div>
    23|         <ul class="table-body">
 ???? 24|           <% items.forEach((item) => { %>
   　　 25|             <li>
   　　 26|               <div class="item-data">
   　　 27|                 <span class="id-column"><%= item.id %></span>

Cannot read property 'forEach' of undefined
    

### 試したこと

定義の確認。別ファイルを作り直しProgate内のコード全コピペ。

### 補足情報（FW/ツールのバージョンなど）

全てProgateに従ってインストールなどをしたはずです。VScodeについて何かプラグイン等が必要であれば教えてください。また、原因が他にある場合もどんなことでもいいので教えてください。

Answer 1

そもそも *.ejs ファイルは、EJS という Node.js の Javascript/html のプリプロセッサ用のファイルです。

つまり Node.js / Javascript が直接処理するファイルでは無く、文法（書式）を勝手に拡張しているので、VS Code の Javascript対応機能で処理できません。私は以前から良く知っていましたため、今まではあなたと同様に、別ファイルを作って再編集していました。

今試しにざっと調べたところ、現在では対応プラグインがあるようです。

https://marketplace.visualstudio.com/items?itemName=DigitalBrainstem.javascript-ejs-support

まだ試していないので正しく動作するか、使い易いかどうかはわかりませんが、参考までにお伝えします。ただし利用の際は拡張子が *.js と *.ejs とでは 書き方（内容）が異なると理解しておくべきです。
私のこの次 EJS を編集するときに試してみたいと思います。

Comments

[ryoto0539]

ご丁寧にありがとうございます！
初心者で説明が下手なものでしたがわかりやすい返答で非常に助かりました。まさか回答をいただけるとも思っていませんでした。本当に助かりました。今後とも努力します。ありがとうございました！！