I'm new to webpack and right now I'm using it for the first time in one of my angular projects.
I want to use the require function in my html file in order to require the template for an ng-include like so:
<div ng-include="require(./my-template.html)"></div>
I know there are loaders like ng-cache and ngtemplate, but they do not work the way I need it. With them, I have to require the template in an js first and than use the template name in my html file.
How to accomplish this?
You can use webpack-required-loader on npm.
In your app js or module js add comment:
//@require "./**/*.html"
And in your template you can use
<div ng-include="'my-template.html'"></div>
Ngtemplate will works fine. Ng-cache works too.
Also note that there is no need for a relative path in the ng-include directive because that is taken care of by adding the //@require command at the head of your entry file.
Lastly, note that you have to use double and single quotes to get ng-include to work. So you'd do "'template-name.html'", not "template-name.html", or 'template-name.html'.