ejs templating

notes.md

@@ -23,11 +23,12 @@ Requirements
 ## NOT INCLUDED
 * code splitting
 
-
 #### html
 
 * html-webpack-plugin - automatically create index.html or use a template file
 	also takes care of templating - default templating is ejs
+* ejs-compiled-loader (for use with the ejs templates) 
+  bit of a fuck on getting it to work - [issue](https://github.com/bazilio91/ejs-compiled-loader/issues/46)
 
 #### js
 
@@ -41,7 +42,7 @@ Requirements
 #### css
 
 * css-loader
-* style-loader - injects css into dom (defaults to style tags) 
+* style-loader - injects css into dom (defaults to style tags)
 * mini-css-extract-plugin - extracts css to separate files
 * postcss-loader
 * postcss-preset-env
@@ -56,15 +57,12 @@ Requirements
 * stylelint-webpack-plugin
 
 #### other
-
 * clean-webpack-plugin
 
-
 #### live server
 * webpack-dev-server
 
 
-
 ## Installation notes
 
 make repository private - edit package.json  

src/templates/index.ejs

@@ -19,7 +19,8 @@
 		</header>
 
 		<main id="js-main">
-			<%- include partials/component %>
+			<% let data = {text: 'text is text'} %>
+			<%- include partials/component data %>
 		</main>
 
 		<footer>

src/templates/partials/component.ejs

@@ -1,3 +1,3 @@
 <div class="component">
-	<p>sdklfj</p>
+	<p><%= data.text %></p>
 </div>

webpack.config.js

@@ -26,11 +26,18 @@ module.exports = env => {
 			}),
 			new CleanWebpackPlugin(),
 			new HtmlWebpackPlugin({
-				template: '!!ejs-compiled-loader?{}!./src/templates/index.ejs'
+				template: './src/templates/index.ejs'
 			}),
 		],
 		module: {
 			rules: [
+				{
+					test: /\.ejs$/,
+					use: {
+						loader: 'ejs-compiled-loader',
+						options: {}, // supply empty options object because of https://github.com/bazilio91/ejs-compiled-loader/issues/46
+					},
+				},
 				{
 					test: /\.js?/,
 					exclude: /node_modules/,