Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Can't include the one HTML template inside another one. #36

Open
andreySadomovskiy opened this issue Sep 18, 2019 · 2 comments
Open

Can't include the one HTML template inside another one. #36

andreySadomovskiy opened this issue Sep 18, 2019 · 2 comments

Comments

@andreySadomovskiy
Copy link

Hello.

I am on the way of learning WebPack and use your example like a start point.
Could you help, please, with the issue?

I have such a file structure:

image

and want to include navigation.html inside header.html

I have the Index.html :

....
<!DOCTYPE html>
<html>
  <%= _.template(require('./../includes/layout/head.html').default)(data) %>
  <body data-spy="scroll" data-target="#subNavigation" data-offset="200">

    <%= _.template(require('./../includes/layout/header.html').default)(data) %>
    <%= _.template(require('./../includes/components/intro.html').default)(data) %>

    <div class="container">Index Page</div>

    <%= _.template(require('./../includes/layout/footer.html').default)(data) %>
    <script src="js/bundle.js"></script>
  </body>
</html>

and the header.html:

<header id="header">
  <img src="img/logo.svg" id="logo" />
  <%= _.template(require('./../includes/components/navigation.html').default)(data) %>
</header>

But as a result, I have an error:

Html Webpack Plugin:
  Error: Cannot find module './../includes/components/navigation.html'
  
  - module.js:11 require
    internal/module.js:11:18
  
  - lodash.templateSources[1]:9 eval
    lodash.templateSources[1]:9:22
  
  - index.html:108 
    D:/Projects/TestProject/markup/src/html/views/index.html:108:132
  
  - index.html:115 ./node_modules/html-webpack-plugin/lib/loader.js!./src/html/views/index.html.module.exports
    D:/Projects/TestProject/markup/src/html/views/index.html:115:3
  
  - index.js:284 Promise.resolve.then
    [markup]/[html-webpack-plugin]/index.js:284:18
  
  - next_tick.js:188 process._tickCallback
    internal/process/next_tick.js:188:7

It would be great if you can push me on the right way.
@lifenautjoe
Copy link
Owner

lifenautjoe commented Sep 22, 2019 •
edited

Hmmm this starter pack does not have an html file loader.

Please try installing https://github.com/webpack-contrib/html-loader .

@andreySadomovskiy
Copy link
Author

Shouldn't row-loader do this?

{
        test: /\.html$/,
        include: path.resolve(__dirname, "src/html/includes"),
        use: ["raw-loader"]
      }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@lifenautjoe @andreySadomovskiy