Provide an option to configure ES module imports

merkle-open · Aug 10, 2021 · c374796 · c374796
1 parent 0adf94f
commit c374796
Show file tree

Hide file tree

Showing 10 changed files with 14,979 additions and 6 deletions.
diff --git a/packages/font-config-webpack-plugin/README.md b/packages/font-config-webpack-plugin/README.md
@@ -52,3 +52,18 @@ module.exports = {
   ],
 };
 ```
+### Enable CommonJS module syntax
+By default the `font-config-webpack-plugin`  uses the CommonJS modules syntax (`require` statements). 
+You can enable a ES module syntax (`import` statements) syntax using: `esModule: true` in the options.
+
+For more information see [file-loader documentation](https://v4.webpack.js.org/loaders/file-loader/#esmodule) 
+```js
+const FontConfigWebpackPlugin = require('font-config-webpack-plugin');
+module.exports = {
+  plugins: [
+    new FontConfigWebpackPlugin({
+      esModule: true
+    }),
+  ],
+};
+```
diff --git a/packages/font-config-webpack-plugin/config/development.config.js b/packages/font-config-webpack-plugin/config/development.config.js
@@ -14,6 +14,7 @@ exports = module.exports = (options) => ({
 						loader: require.resolve('file-loader'),
 						options: {
 							name: options.name,
+							esModule: options.esModule,
 						},
 					},
 				],

diff --git a/packages/font-config-webpack-plugin/package-lock.json b/packages/font-config-webpack-plugin/package-lock.json
diff --git a/packages/font-config-webpack-plugin/src/FontConfigWebpackPlugin.js b/packages/font-config-webpack-plugin/src/FontConfigWebpackPlugin.js
@@ -8,14 +8,15 @@
  * Plugin Options
  * @typedef {{
 	 mode?: 'production' | 'development'
-	 name: string,
+	 esModule?: boolean
+	 name: string
 }} FontConfigWebpackPluginOptions */
 
 'use strict';
 /**
  * @type {FontConfigWebpackPluginOptions}
  */
-const defaultOptions = { name: 'static/media/[name].[hash:8].[ext]' };
+const defaultOptions = { name: 'static/media/[name].[hash:8].[ext]', esModule: false };
 
 class FontConfigWebpackPlugin {
 	/**

diff --git a/packages/font-config-webpack-plugin/test/FontConfigWebpackPlugin.test.js b/packages/font-config-webpack-plugin/test/FontConfigWebpackPlugin.test.js
@@ -26,7 +26,7 @@ describe('FontConfigWebpackPlugin standalone', () => {
 	});
 
 	it('should return an instance with the options assigned to it', () => {
-		const options = { name: '[hash]-[name].[ext]' };
+		const options = { name: '[hash]-[name].[ext]', esModule: false };
 		const instance = new FontConfigWebpackPlugin(options);
 
 		expect(instance.options).toEqual(options);

diff --git a/packages/image-config-webpack-plugin/README.md b/packages/image-config-webpack-plugin/README.md
@@ -52,3 +52,19 @@ module.exports = {
   ],
 };
 ```
+### Enable CommonJS module syntax
+By default the `image-config-webpack-plugin`  uses the CommonJS modules syntax (`require` statements). 
+You can enable a ES module syntax (`import` statements) syntax using: `esModule: true` in the options.
+
+For more information see [file-loader documentation](https://v4.webpack.js.org/loaders/file-loader/#esmodule) 
+
+```js
+const ImageConfigWebpackPlugin = require('image-config-webpack-plugin');
+module.exports = {
+  plugins: [
+    new ImageConfigWebpackPlugin({
+      esModule: true
+    }),
+  ],
+};
+```
diff --git a/packages/image-config-webpack-plugin/config/development.config.js b/packages/image-config-webpack-plugin/config/development.config.js
@@ -14,6 +14,7 @@ exports = module.exports = (options) => ({
 						loader: require.resolve('file-loader'),
 						options: {
 							name: options.name,
+							esModule: options.esModule,
 						},
 					},
 				],