Go to Qiita Advent Calendar 2024 Top
LoginSignup
ConectTheDots314
@ConectTheDots314

Are you sure you want to delete the question?

If your question is resolved, you may close it.

Leaving a resolved question undeleted may help others!

We hope you find it useful!

相対パスは合っているはずなのに、Error: Could not find the include file "src/templates/_head"と出てしまう

Q&A

ejswebpackwebpack-dev-serverwebpack.config.js

1. 【必須】やりたい・やりたかったこと

$yarn startしてhttp://localhost:9000/
を表示させたい

以前はできたのだがなぜかエラーが出ます

2. 【必須】起きている問題やエラーメッセージ ※できるだけ詳細に書いてください

ERROR in ./src/about.ejs (./node_modules/html-webpack-plugin/lib/loader.js!./src/about.ejs)
    Module build failed (from ./node_modules/ejs-compiled-loader/index.js):
    Error: Could not find the include file "src/templates/_head"
        at getIncludePath (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:165:13)
        at includeSource (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:309:17)
        at /Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:745:26
        at Array.forEach (<anonymous>)
        at Template.generateSource (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:721:15)
        at Template.compile (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:574:12)
        at Object.compile (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:392:16)
        at module.exports (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs-compiled-loader/index.js:28:22)
Child html-webpack-plugin for "index.html":
     1 asset
    Entrypoint undefined = ./index.html
    [./node_modules/html-webpack-plugin/lib/loader.js!./src/index.ejs] 925 bytes {0} [built] [failed] [1 error]
    
    ERROR in ./src/index.ejs (./node_modules/html-webpack-plugin/lib/loader.js!./src/index.ejs)
    Module build failed (from ./node_modules/ejs-compiled-loader/index.js):
    Error: Could not find the include file "src/templates/_head"
        at getIncludePath (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:165:13)
        at includeSource (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:309:17)
        at /Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:745:26
        at Array.forEach (<anonymous>)
        at Template.generateSource (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:721:15)
        at Template.compile (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:574:12)
        at Object.compile (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:392:16)
        at module.exports (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs-compiled-loader/index.js:28:22)

3. 【必須】ご自身で試されたこと ※できるだけ詳細に書いてください

yarn start

ERROR in   Error: Child compilation failed:
  Module build failed (from ./node_modules/ejs-compiled-loader/index.js):
  Error: Could not find the include file "../templates/_head"
  
  - ejs.js:165 getIncludePath
    [02]/[ejs]/lib/ejs.js:165:13
  
  - ejs.js:309 includeSource
    [02]/[ejs]/lib/ejs.js:309:17
  
  - ejs.js:745 
    [02]/[ejs]/lib/ejs.js:745:26
  
  - Array.forEach
  
  - ejs.js:721 Template.generateSource
    [02]/[ejs]/lib/ejs.js:721:15
  
  - ejs.js:574 Template.compile
    [02]/[ejs]/lib/ejs.js:574:12
  
  - ejs.js:392 Object.compile
    [02]/[ejs]/lib/ejs.js:392:16
  
  
  - Error: Could not find the include file "../templates/_head"
  
  - compiler.js:79 
    [02]/[html-webpack-plugin]/lib/compiler.js:79:16
  
  - Compiler.js:343 
    [02]/[webpack]/lib/Compiler.js:343:11
  
  - Compiler.js:681 
    [02]/[webpack]/lib/Compiler.js:681:15
  
  
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [02]/[tapable]/lib/Hook.js:154:20
  
  - Compiler.js:678 
    [02]/[webpack]/lib/Compiler.js:678:31
  
  
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [02]/[tapable]/lib/Hook.js:154:20
  
  - Compilation.js:1423 
    [02]/[webpack]/lib/Compilation.js:1423:35
  
  


ERROR in   Error: Child compilation failed:
  Module build failed (from ./node_modules/ejs-compiled-loader/index.js):
  Error: Could not find the include file "src/templates/_head"
  
  - ejs.js:165 getIncludePath
    [02]/[ejs]/lib/ejs.js:165:13
  
  - ejs.js:309 includeSource
    [02]/[ejs]/lib/ejs.js:309:17
  
  - ejs.js:745 
    [02]/[ejs]/lib/ejs.js:745:26
  
  - Array.forEach
  
  - ejs.js:721 Template.generateSource
    [02]/[ejs]/lib/ejs.js:721:15
  
  - ejs.js:574 Template.compile
    [02]/[ejs]/lib/ejs.js:574:12
  
  - ejs.js:392 Object.compile
    [02]/[ejs]/lib/ejs.js:392:16
  
  
  - Error: Could not find the include file "src/templates/_head"
  
  - compiler.js:79 
    [02]/[html-webpack-plugin]/lib/compiler.js:79:16
  
  - Compiler.js:343 
    [02]/[webpack]/lib/Compiler.js:343:11
  
  - Compiler.js:681 
    [02]/[webpack]/lib/Compiler.js:681:15
  
  
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [02]/[tapable]/lib/Hook.js:154:20
  
  - Compiler.js:678 
    [02]/[webpack]/lib/Compiler.js:678:31
  
  
  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [02]/[tapable]/lib/Hook.js:154:20
  
  - Compilation.js:1423 
    [02]/[webpack]/lib/Compilation.js:1423:35
  
  

Child html-webpack-plugin for "about.html":
     1 asset
    Entrypoint undefined = ./about.html
    [./node_modules/html-webpack-plugin/lib/loader.js!./src/about.ejs] 924 bytes {1} [built] [failed] [1 error]
    
    ERROR in ./src/about.ejs (./node_modules/html-webpack-plugin/lib/loader.js!./src/about.ejs)
    Module build failed (from ./node_modules/ejs-compiled-loader/index.js):
    Error: Could not find the include file "src/templates/_head"
        at getIncludePath (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:165:13)
        at includeSource (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:309:17)
        at /Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:745:26
        at Array.forEach (<anonymous>)
        at Template.generateSource (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:721:15)
        at Template.compile (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:574:12)
        at Object.compile (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:392:16)
        at module.exports (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs-compiled-loader/index.js:28:22)
Child html-webpack-plugin for "index.html":
     1 asset
    Entrypoint undefined = ./index.html
    [./node_modules/html-webpack-plugin/lib/loader.js!./src/index.ejs] 925 bytes {1} [built] [failed] [1 error]
    
    ERROR in ./src/index.ejs (./node_modules/html-webpack-plugin/lib/loader.js!./src/index.ejs)
    Module build failed (from ./node_modules/ejs-compiled-loader/index.js):
    Error: Could not find the include file "src/templates/_head"
        at getIncludePath (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:165:13)
        at includeSource (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:309:17)
        at /Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:745:26
        at Array.forEach (<anonymous>)
        at Template.generateSource (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:721:15)
        at Template.compile (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:574:12)
        at Object.compile (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs/lib/ejs.js:392:16)
        at module.exports (/Users/shouminotaku/Frontend.Basic/1-EJS/02/node_modules/ejs-compiled-loader/index.js:28:22)

エラーメッセージによると、include ファイル "src/templates/_head" が見つからないために、ejs-compiled-loader がエラーを出力している。このエラーを解決するためには、ejs-compiled-loader に渡されているオプションに問題がある可能性あり。

エラーメッセージによると、ejs-compiled-loader が webpack.config.js の module オプションで設定されている。この設定では、ejs ファイルをコンパイルするために ejs-compiled-loader を使用する。

ejs ファイルで include を使用する場合、ejs-compiled-loader のオプションに htmlWebpackPlugin を設定する必要があるようだ。

webpack.config.js の module オプションで ejs-compiled-loader の設定を次のように修正してみる

webpack.config.js

module: {
  rules: [
    {
      test: /\.ejs$/,
      loader: "ejs-compiled-loader",
      options: {
        htmlmin: true,
        htmlminOptions: {
          removeComments: true,
        },
        compiler: require("ejs"),
        compilerOptions: {
          client: true,
        },
        htmlWebpackPlugin: {
          files: {
            template: "src/templates/_head.ejs",
          },
        },
      },
    },
  ],
},

再度yarn startするも
エラーは変わらず・・

5. 関連するURL ※GithubのリポジトリリンクやサーバーのURLなど

node_modulesファルダ以外が入っています。（ファイルが多いためアップできませんでした）

0

1Answer

blue32a
@blue32a

about.ejsから_head.ejsを読み込むのですから、./templates/_head.ejsではないですか？
webpackでEJSを使ったことはないのですが、そのようにincludeしていました。

  • about.ejs
  • templates
    • _head.ejs

node_modulesファルダ以外が入っています。（ファイルが多いためアップできませんでした）

基本的にnode_modulesを自分のgitで管理することはありません。
依存関係はpackage.jsonやpackage-lock.jsonで管理されているので、これがあれば各自でインストールできます。
あえてgitでバージョン管理が必要となるケースは少ないでしょう。

0Like

Your answer might help someone💌

LoginSign Up