build umd module; slim down by allowing to add individual icons and n…

…ot include FA in

the package; set react + FA as peerDependencies; add source-maps;

.babelrc

@@ -1,3 +1,3 @@
 {
-  "presets": [ "@babel/preset-env", "@babel/preset-react" ]
+  "presets": [ "@babel/preset-react" ]
 }

package.json

@@ -4,9 +4,9 @@
   "description": "Plugin for stardust-ui that provides font awesome icons.",
   "main": "./dist/bundle.js",
   "scripts": {
-    "start": "webpack --watch --mode development",
+    "start": "webpack --watch --mode development --config webpack.dev.js",
     "prepare": "npm run build",
-    "build": "webpack --mode production",
+    "build": "webpack --mode production --config webpack.prod.js",
     "test": "jest"
   },
   "repository": {
@@ -21,23 +21,21 @@
   "homepage": "https://github.com/JEStaubach/stardust-ui-font-awesome-plugin#readme",
   "private": true,
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^1.2.17",
-    "@fortawesome/free-brands-svg-icons": "^5.8.1",
-    "@fortawesome/free-regular-svg-icons": "^5.8.1",
-    "@fortawesome/free-solid-svg-icons": "^5.8.1",
     "@fortawesome/react-fontawesome": "^0.1.4",
-    "react": "^16.8.6",
     "webpack": "^4.30.0"
   },
   "peerDependencies": {
-    "@stardust-ui/react": "^0.27.0"
+    "@fortawesome/react-fontawesome": ">=0.1.4",
+    "react": ">=16.8.6",
+    "@stardust-ui/react": ">=0.27.0"
   },
   "devDependencies": {
     "@babel/cli": "^7.4.3",
     "@babel/core": "^7.4.3",
     "@babel/preset-env": "^7.4.3",
     "@babel/preset-react": "^7.0.0",
     "babel-loader": "^8.0.5",
-    "webpack-cli": "^3.3.0"
+    "webpack-cli": "^3.3.0",
+    "webpack-merge": "^4.2.1"
   }
 }

src/index.js

@@ -1,31 +1,23 @@
 import React from 'react';
-import { library } from '@fortawesome/fontawesome-svg-core';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import * as freeSolidSvgIcons from '@fortawesome/free-solid-svg-icons';
-import * as freeBrandsSvgIcons from '@fortawesome/free-brands-svg-icons';
-import * as freeRegularSvgIcons from '@fortawesome/free-regular-svg-icons';
 
-
-const isMatch = key => ( key.match(/^fa[A-Z]/g) !== null );
-
-const iconSets = [freeSolidSvgIcons, freeBrandsSvgIcons, freeRegularSvgIcons];
-
-const faIcons = iconSets.map( iconSet => (
-  Object.keys(iconSet).reduce( (acc, cur) => {
-    if (isMatch(cur)) {
-      library.add(iconSet[cur]);
-      return {
-        ...acc,
-        [`${iconSet[cur].prefix} ${iconSet[cur].iconName}`]: {
-          isSvg: true,
-          icon: () => <FontAwesomeIcon icon={iconSet[cur]} />,
-        },
-      };
-    }
-    return acc;
-  }, {})
-)).reduce( (acc, curr) => ({ ...acc, ...curr }), {});
+const wrapLibrary = lib => {
+  return Object.keys(lib.definitions).reduce( (acc, prefix) => {
+    return {
+      ...acc,
+      ...Object.keys(lib.definitions[prefix]).reduce( (acc2, iconName) => {
+        return {
+          ...acc2,
+          [`${prefix} ${iconName}`]: {
+            isSvg: true,
+            icon: () => <FontAwesomeIcon icon={{prefix, iconName, icon: lib.definitions[prefix][iconName]}} />,
+          }
+        };
+      }, {})
+    };
+  }, {});
+}
 
 export {
-  faIcons,
+  wrapLibrary,
 };

webpack.common.js

@@ -0,0 +1,23 @@
+module.exports = {
+  entry: './src/index.js',
+  output: {
+    library: 'stardust-ui-font-awesome-plugin',
+    libraryTarget: 'umd',
+    filename: 'bundle.js'
+},
+  module: {
+    rules: [
+      {
+        test: /\.(js|jsx)$/,
+        exclude: /node_modules/,
+        use: { loader: 'babel-loader' }
+      }
+    ]
+  },
+  externals: [
+    {
+      react: 'react',
+      '@fortawesome/react-fontawesome': '@fortawesome/react-fontawesome'
+    }
+  ]
+};

webpack.dev.js

@@ -0,0 +1,10 @@
+const merge = require('webpack-merge');
+const common = require('./webpack.common.js');
+
+module.exports = merge(common, {
+  mode: 'development',
+  devtool: 'inline-source-map',
+  devServer: {
+    contentBase: './dist'
+  }
+});

webpack.prod.js

@@ -0,0 +1,7 @@
+const merge = require('webpack-merge');
+const common = require('./webpack.common.js');
+
+module.exports = merge(common, {
+  mode: 'production',
+  devtool: 'source-map',
+});