diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml index 4f80ea0..d64caa8 100644 --- a/.github/workflows/tests.yml +++ b/.github/workflows/tests.yml @@ -7,10 +7,10 @@ jobs: runs-on: ubuntu-latest steps: - uses: actions/checkout@v2 - - name: Uses Node.js 10 + - name: Uses Node.js 12.13.0 uses: actions/setup-node@v1 with: - node-version: 10 + node-version: 12.13.0 - run: npm install -g yarn - run: yarn install - run: yarn test diff --git a/.nvmrc b/.nvmrc index d191598..47c0a98 100644 --- a/.nvmrc +++ b/.nvmrc @@ -1 +1 @@ -10.16.3 +12.13.0 diff --git a/examples/analytics/dist/index.html b/examples/analytics/dist/index.html index bf2d0bc..d8936f2 100644 --- a/examples/analytics/dist/index.html +++ b/examples/analytics/dist/index.html @@ -2,7 +2,7 @@ function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); -gtag('config', 'UA-28076707-7');Webpack App

Hello world!


webpack.config.js

+gtag('config', 'UA-28076707-7');Webpack App

Hello world!


webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackPartialsPlugin = require('../../');
@@ -48,4 +48,4 @@
 
 gtag('config', '<%= ga_property_id %>');
 </script>
-
\ No newline at end of file +
\ No newline at end of file diff --git a/examples/analytics/dist/main.js b/examples/analytics/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/analytics/dist/main.js +++ b/examples/analytics/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/basic-multi/dist/index.html b/examples/basic-multi/dist/index.html index 3268c1e..8505152 100644 --- a/examples/basic-multi/dist/index.html +++ b/examples/basic-multi/dist/index.html @@ -1,4 +1,4 @@ -Webpack App

Hello world!

Other Page

webpack.config.js

+Webpack App

Hello world!

Other Page

webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackPartialsPlugin = require('../../');
@@ -42,4 +42,4 @@
 ...and the rest of this configuration example
 

partials/other-body.html

 <h1>Hello other world!</h1>
-
\ No newline at end of file +
\ No newline at end of file diff --git a/examples/basic-multi/dist/main.js b/examples/basic-multi/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/basic-multi/dist/main.js +++ b/examples/basic-multi/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/basic-multi/dist/other-page.html b/examples/basic-multi/dist/other-page.html index 5132c6d..9b124ab 100644 --- a/examples/basic-multi/dist/other-page.html +++ b/examples/basic-multi/dist/other-page.html @@ -1 +1 @@ -

Hello other world!

\ No newline at end of file +

Hello other world!

\ No newline at end of file diff --git a/examples/basic/dist/index.html b/examples/basic/dist/index.html index 73272cf..e7ec536 100644 --- a/examples/basic/dist/index.html +++ b/examples/basic/dist/index.html @@ -1,4 +1,4 @@ -Webpack App

Hello world!


webpack.config.js

+Webpack App

Hello world!


webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackPartialsPlugin = require('../../');
@@ -23,4 +23,4 @@
 

partials/body.html

 <h1>Hello world!</h1>
 ...and the rest of this configuration example
-
\ No newline at end of file +
\ No newline at end of file diff --git a/examples/basic/dist/main.js b/examples/basic/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/basic/dist/main.js +++ b/examples/basic/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/body-attribute/dist/index.html b/examples/body-attribute/dist/index.html index 5d531da..7976d49 100644 --- a/examples/body-attribute/dist/index.html +++ b/examples/body-attribute/dist/index.html @@ -1,4 +1,4 @@ -Custom Webpack Template

Hello world!


webpack.config.js

+Custom Webpack Template

Hello world!


webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackPartialsPlugin = require('../../');
@@ -30,4 +30,4 @@
 

partials/body.html

 <h1>Hello world!</h1>
 ...and the rest of this configuration example
-
\ No newline at end of file +
\ No newline at end of file diff --git a/examples/body-attribute/dist/main.js b/examples/body-attribute/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/body-attribute/dist/main.js +++ b/examples/body-attribute/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/custom-multi-template-filename/dist/index.html b/examples/custom-multi-template-filename/dist/index.html index 149db1c..af3b20e 100644 --- a/examples/custom-multi-template-filename/dist/index.html +++ b/examples/custom-multi-template-filename/dist/index.html @@ -1 +1 @@ -Webpack App

Hello mad world!

\ No newline at end of file +Webpack App

Hello mad world!

\ No newline at end of file diff --git a/examples/custom-multi-template-filename/dist/main.js b/examples/custom-multi-template-filename/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/custom-multi-template-filename/dist/main.js +++ b/examples/custom-multi-template-filename/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/custom-multi-template-filename/dist/other-page.html b/examples/custom-multi-template-filename/dist/other-page.html index caf2178..a172ccb 100644 --- a/examples/custom-multi-template-filename/dist/other-page.html +++ b/examples/custom-multi-template-filename/dist/other-page.html @@ -1 +1 @@ -

Hello mad world!

\ No newline at end of file +

Hello mad world!

\ No newline at end of file diff --git a/examples/high-priority-head-no-meta/dist/index.html b/examples/high-priority-head-no-meta/dist/index.html index c9f1062..dd71f6b 100644 --- a/examples/high-priority-head-no-meta/dist/index.html +++ b/examples/high-priority-head-no-meta/dist/index.html @@ -1,7 +1,7 @@ Custom Webpack Template
HTMLHeadElement

Hello world!


webpack.config.js

+}Custom Webpack Template
HTMLHeadElement

Hello world!


webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackPartialsPlugin = require('../../');
@@ -35,4 +35,4 @@
 

partials/body.html

 <h1>Hello world!</h1>
 ...and the rest of this configuration example
-
\ No newline at end of file +
\ No newline at end of file diff --git a/examples/high-priority-head-no-meta/dist/main.js b/examples/high-priority-head-no-meta/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/high-priority-head-no-meta/dist/main.js +++ b/examples/high-priority-head-no-meta/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/high-priority-head/dist/index.html b/examples/high-priority-head/dist/index.html index fc685c1..5d8c75b 100644 --- a/examples/high-priority-head/dist/index.html +++ b/examples/high-priority-head/dist/index.html @@ -1,7 +1,7 @@ Webpack App

Hello world!


webpack.config.js

+}Webpack App

Hello world!


webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackPartialsPlugin = require('html-webpack-partials-plugin');
@@ -38,4 +38,4 @@
   background-color: #5F4B8B;
 }
 </style>
-
\ No newline at end of file +
\ No newline at end of file diff --git a/examples/high-priority-head/dist/main.js b/examples/high-priority-head/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/high-priority-head/dist/main.js +++ b/examples/high-priority-head/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/html-loader/dist/images/html5.png b/examples/html-loader/dist/images/html5.png new file mode 100644 index 0000000..cdd959b Binary files /dev/null and b/examples/html-loader/dist/images/html5.png differ diff --git a/examples/html-loader/dist/images/webpack.png b/examples/html-loader/dist/images/webpack.png new file mode 100644 index 0000000..efd4ad9 Binary files /dev/null and b/examples/html-loader/dist/images/webpack.png differ diff --git a/examples/html-loader/dist/index.html b/examples/html-loader/dist/index.html index 0b73522..0f42510 100644 --- a/examples/html-loader/dist/index.html +++ b/examples/html-loader/dist/index.html @@ -1,7 +1,7 @@ -Webpack App

Hello world!

webpack.config.js

+

Hello world!


Image in template


Image in partial


webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
-const HtmlWebpackPartialsPlugin = require('html-webpack-partials-plugin');
+const HtmlWebpackPartialsPlugin = require('../../');
 
 module.exports = {
   entry: {
@@ -9,13 +9,72 @@
   },
   output: {
     path: path.join(__dirname, './dist'),
-    filename: '[name].js'
+    filename: '[name].js',
+    assetModuleFilename: 'images/[name][ext]',
   },
   plugins: [
-    new HtmlWebpackPlugin(),
+    new HtmlWebpackPlugin({
+      template: path.join(__dirname, './wrapper.html')
+    }),
     new HtmlWebpackPartialsPlugin({
       path: path.join(__dirname, './partials/body.html')
     })
-  ]
+  ],
+  module: {
+    rules: [
+      {
+        test: /\.(html)$/,
+        use: {
+          loader: 'html-loader',
+          options: {
+            sources: {
+              list: [
+                {
+                  tag: 'img',
+                  attribute: 'src',
+                  type: 'src',
+                }
+              ]
+            }
+          }
+        }
+      }
+    ]
+  }
 };
-
\ No newline at end of file +

main.js

+console.log('Test!');
+

wrapper.html

+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+</head>
+<style>
+  img{
+    max-width: 320px;
+    height: auto;
+  }
+</style>
+<body>
+<h1>Hello world!</h1>
+
+<hr />
+
+<h2>Image in template</h2>
+
+<img src="./images/html5.png" />
+
+<hr />
+  
+</body>
+</html>
+

partials/body.html

+<h2>Image in partial</h2>
+
+<img src="../images/webpack.png" />
+
+<hr />
+
+...and the rest of this configuration example
+
\ No newline at end of file diff --git a/examples/html-loader/dist/main.js b/examples/html-loader/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/html-loader/dist/main.js +++ b/examples/html-loader/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/html-loader/dist/partial.html b/examples/html-loader/dist/partial.html deleted file mode 100644 index 87b831d..0000000 --- a/examples/html-loader/dist/partial.html +++ /dev/null @@ -1,21 +0,0 @@ -

Hello world!

webpack.config.js

-const path = require('path');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const HtmlWebpackPartialsPlugin = require('html-webpack-partials-plugin');
-
-module.exports = {
-  entry: {
-    main: path.join(__dirname, './main.js')
-  },
-  output: {
-    path: path.join(__dirname, './dist'),
-    filename: '[name].js'
-  },
-  plugins: [
-    new HtmlWebpackPlugin(),
-    new HtmlWebpackPartialsPlugin({
-      path: path.join(__dirname, './partials/body.html')
-    })
-  ]
-};
-
\ No newline at end of file diff --git a/examples/html-loader/partials/body.html b/examples/html-loader/partials/body.html index 3489b58..376289b 100644 --- a/examples/html-loader/partials/body.html +++ b/examples/html-loader/partials/body.html @@ -1,13 +1,14 @@ -

Hello world!

- -

webpack.config.js

+

Image in partial

+
+ +

webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
-const HtmlWebpackPartialsPlugin = require('html-webpack-partials-plugin');
+const HtmlWebpackPartialsPlugin = require('../../');
 
 module.exports = {
   entry: {
@@ -15,13 +16,81 @@ 

webpack.config.js

}, output: { path: path.join(__dirname, './dist'), - filename: '[name].js' + filename: '[name].js', + assetModuleFilename: 'images/[name][ext]', }, plugins: [ - new HtmlWebpackPlugin(), + new HtmlWebpackPlugin({ + template: path.join(__dirname, './wrapper.html') + }), new HtmlWebpackPartialsPlugin({ path: path.join(__dirname, './partials/body.html') }) - ] + ], + module: { + rules: [ + { + test: /\.(html)$/, + use: { + loader: 'html-loader', + options: { + sources: { + list: [ + { + tag: 'img', + attribute: 'src', + type: 'src', + } + ] + } + } + } + } + ] + } }; +
+ +

main.js

+
+console.log('Test!');
+
+ +

wrapper.html

+
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+</head>
+<style>
+  img{
+    max-width: 320px;
+    height: auto;
+  }
+</style>
+<body>
+<h1>Hello world!</h1>
+
+<hr />
+
+<h2>Image in template</h2>
+
+<img src="./images/html5.png" />
+
+<hr />
+  
+</body>
+</html>
+
+ +

partials/body.html

+
+<h2>Image in partial</h2>
+
+<img src="../images/webpack.png" />
+
+<hr />
+
+...and the rest of this configuration example
 
\ No newline at end of file diff --git a/examples/html-loader/webpack.config.js b/examples/html-loader/webpack.config.js index 9df2554..89af1ee 100644 --- a/examples/html-loader/webpack.config.js +++ b/examples/html-loader/webpack.config.js @@ -8,11 +8,12 @@ module.exports = { }, output: { path: path.join(__dirname, './dist'), - filename: '[name].js' + filename: '[name].js', + assetModuleFilename: 'images/[name][ext]', }, plugins: [ new HtmlWebpackPlugin({ - // template: path.join(__dirname, './wrapper.html') + template: path.join(__dirname, './wrapper.html') }), new HtmlWebpackPartialsPlugin({ path: path.join(__dirname, './partials/body.html') @@ -25,22 +26,17 @@ module.exports = { use: { loader: 'html-loader', options: { - attrs: ['img:src', ':srcset'], - interpolate: require, - minimize: true - }, - } - }, - { - test: /\.(gif|png|jpe?g|svg)$/i, - use: [ - { - loader: 'file-loader', - options: { - name: '[path][name].[ext]' + sources: { + list: [ + { + tag: 'img', + attribute: 'src', + type: 'src', + } + ] } } - ] + } } ] } diff --git a/examples/html-loader/wrapper.html b/examples/html-loader/wrapper.html index 5bd6bf9..2252de8 100644 --- a/examples/html-loader/wrapper.html +++ b/examples/html-loader/wrapper.html @@ -3,7 +3,22 @@ + - +

Hello world!

+ +
+ +

Image in template

+ + + +
+ \ No newline at end of file diff --git a/examples/minify/dist/index.html b/examples/minify/dist/index.html index e247b88..7c278f6 100644 --- a/examples/minify/dist/index.html +++ b/examples/minify/dist/index.html @@ -1,4 +1,4 @@ -Webpack App

Hello world!

Test

webpack.config.js

+Webpack App

Hello world!

Test

webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackPartialsPlugin = require('../../');
@@ -12,27 +12,24 @@
     filename: '[name].js'
   },
   plugins: [
-    new HtmlWebpackPlugin({
-      minify: {
-
-        // Begin HTML Webpack Plugin Default
-        collapseWhitespace: true,
-        removeComments: true,
-        removeRedundantAttributes: true,
-        removeScriptTypeAttributes: true,
-        removeStyleLinkTypeAttributes: true,
-        useShortDoctype: true,
-        // End HTML Webpack Plugin Default
-
-        minifyJS: true,
-        minifyCSS: true,
-
-      },
-    }),
+    new HtmlWebpackPlugin(),
     new HtmlWebpackPartialsPlugin({
       path: path.join(__dirname, './partials/body.html')
     })
-  ]
+  ],
+  module: {
+    rules: [
+      {
+        test: /\.(html)$/,
+        use: {
+          loader: 'html-loader',
+          options: {
+            minimize: true
+          },
+        }
+      }
+    ]
+  }
 };
 

main.js

 console.log('Test!');
@@ -56,4 +53,4 @@
 console.log('three');
 </script>
 ...and the rest of this configuration example
-
\ No newline at end of file +
\ No newline at end of file diff --git a/examples/minify/dist/main.js b/examples/minify/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/minify/dist/main.js +++ b/examples/minify/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/minify/partials/body.html b/examples/minify/partials/body.html index ae81885..2574042 100644 --- a/examples/minify/partials/body.html +++ b/examples/minify/partials/body.html @@ -34,27 +34,24 @@

webpack.config.js

filename: '[name].js' }, plugins: [ - new HtmlWebpackPlugin({ - minify: { - - // Begin HTML Webpack Plugin Default - collapseWhitespace: true, - removeComments: true, - removeRedundantAttributes: true, - removeScriptTypeAttributes: true, - removeStyleLinkTypeAttributes: true, - useShortDoctype: true, - // End HTML Webpack Plugin Default - - minifyJS: true, - minifyCSS: true, - - }, - }), + new HtmlWebpackPlugin(), new HtmlWebpackPartialsPlugin({ path: path.join(__dirname, './partials/body.html') }) - ] + ], + module: { + rules: [ + { + test: /\.(html)$/, + use: { + loader: 'html-loader', + options: { + minimize: true + }, + } + } + ] + } }; diff --git a/examples/minify/webpack.config.js b/examples/minify/webpack.config.js index 400aa2e..806942c 100644 --- a/examples/minify/webpack.config.js +++ b/examples/minify/webpack.config.js @@ -11,25 +11,22 @@ module.exports = { filename: '[name].js' }, plugins: [ - new HtmlWebpackPlugin({ - minify: { - - // Begin HTML Webpack Plugin Default - collapseWhitespace: true, - removeComments: true, - removeRedundantAttributes: true, - removeScriptTypeAttributes: true, - removeStyleLinkTypeAttributes: true, - useShortDoctype: true, - // End HTML Webpack Plugin Default - - minifyJS: true, - minifyCSS: true, - - }, - }), + new HtmlWebpackPlugin(), new HtmlWebpackPartialsPlugin({ path: path.join(__dirname, './partials/body.html') }) - ] + ], + module: { + rules: [ + { + test: /\.(html)$/, + use: { + loader: 'html-loader', + options: { + minimize: true + }, + } + }, + ] + } }; \ No newline at end of file diff --git a/examples/page-template/dist/about.html b/examples/page-template/dist/about.html index bb630b4..64758b6 100644 --- a/examples/page-template/dist/about.html +++ b/examples/page-template/dist/about.html @@ -1 +1 @@ -

Hello, about!

\ No newline at end of file +

Hello, about!

\ No newline at end of file diff --git a/examples/page-template/dist/index.html b/examples/page-template/dist/index.html index 84efdf7..7784631 100644 --- a/examples/page-template/dist/index.html +++ b/examples/page-template/dist/index.html @@ -1,4 +1,4 @@ -

Hello, Home!

About Page

webpack.config.js

+

Hello, Home!

About Page

webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackPartialsPlugin = require('../../');
@@ -58,4 +58,4 @@
 <footer>Footer</footer>
 

partials/nav.html

 <nav>Nav</nav>
-
\ No newline at end of file +
\ No newline at end of file diff --git a/examples/page-template/dist/main.js b/examples/page-template/dist/main.js index a5093ab..6f1c74d 100644 --- a/examples/page-template/dist/main.js +++ b/examples/page-template/dist/main.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t){console.log("Test!")}]); \ No newline at end of file +console.log("Test!"); \ No newline at end of file diff --git a/examples/react-root/dist/index.html b/examples/react-root/dist/index.html index f344ad9..8b74408 100644 --- a/examples/react-root/dist/index.html +++ b/examples/react-root/dist/index.html @@ -1,4 +1,4 @@ -Webpack App

webpack.config.js

+Webpack App

webpack.config.js

 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const HtmlWebpackPartialsPlugin = require('../../');
@@ -46,4 +46,4 @@ 

Hello, world!

,

partials/body.html

 <div id="root"></div>
 ...and the rest of this configuration example
-
\ No newline at end of file +
\ No newline at end of file diff --git a/examples/react-root/dist/main.js b/examples/react-root/dist/main.js index 5309f3d..8b9fd06 100644 --- a/examples/react-root/dist/main.js +++ b/examples/react-root/dist/main.js @@ -1,30 +1,2 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var l=t[r]={i:r,l:!1,exports:{}};return e[r].call(l.exports,l,l.exports,n),l.l=!0,l.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var l in e)n.d(r,l,function(t){return e[t]}.bind(null,l));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=3)}([function(e,t,n){"use strict";e.exports=n(4)},function(e,t,n){"use strict"; -/* -object-assign -(c) Sindre Sorhus -@license MIT -*/var r=Object.getOwnPropertySymbols,l=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable;function a(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map((function(e){return t[e]})).join(""))return!1;var r={};return"abcdefghijklmnopqrst".split("").forEach((function(e){r[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},r)).join("")}catch(e){return!1}}()?Object.assign:function(e,t){for(var n,o,u=a(e),c=1;cz.length&&z.push(e)}function R(e,t,n){return null==e?0:function e(t,n,r,l){var o=typeof t;"undefined"!==o&&"boolean"!==o||(t=null);var u=!1;if(null===t)u=!0;else switch(o){case"string":case"number":u=!0;break;case"object":switch(t.$$typeof){case i:case a:u=!0}}if(u)return r(l,t,""===n?"."+I(t,0):n),1;if(u=0,n=""===n?".":n+":",Array.isArray(t))for(var c=0;c