feat: module sharing is working across components and run packages

packages/grafnode-components/.babelrc

@@ -0,0 +1,6 @@
+{
+  "presets": [
+    "@babel/preset-env",
+    ["@babel/preset-react", {"runtime": "automatic"}]
+  ]
+}

packages/grafnode-components/.gitignore

@@ -10,6 +10,7 @@
 
 # production
 /build
+/dist
 
 # misc
 .DS_Store

packages/grafnode-components/index.js

@@ -1 +0,0 @@
-module.exports = 'Hello';

packages/grafnode-components/package.json

@@ -2,8 +2,9 @@
   "name": "@grafnode/components",
   "version": "0.0.1",
   "description": "",
-  "main": "index.js",
+  "main": "dist/index.js",
   "scripts": {
+    "build": "webpack --mode production",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {
@@ -15,5 +16,17 @@
   "bugs": {
     "url": "https://github.com/grafnode/grafnode/issues"
   },
-  "homepage": "https://github.com/grafnode/grafnode#readme"
+  "homepage": "https://github.com/grafnode/grafnode#readme",
+  "dependencies": {
+  },
+  "peerDependencies": {
+    "@fortawesome/fontawesome-svg-core": "^1.2.36",
+    "@fortawesome/free-solid-svg-icons": "^5.15.4",
+    "@fortawesome/react-fontawesome": "^0.1.16",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-tabs": "^3.2.3",
+    "styled-components": "^5.3.3",
+    "tailwindcss": "^2.2.19"
+  }
 }

packages/grafnode-components/src/components/Navbar/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+
+const Navbar = () => {
+  return (
+    <div className="px-3 py-2 flex items-center bg-gray-200 justify-center">
+      Navbar
+    </div>
+  )
+};
+
+export default Navbar;

packages/grafnode-components/src/index.js

@@ -0,0 +1,4 @@
+import Navbar from './components/Navbar';
+
+export default Navbar;
+

packages/grafnode-components/webpack.config.js

@@ -0,0 +1,26 @@
+const path = require('path');
+
+module.exports = {
+  entry: "./src/index.js",
+  output: {
+    globalObject: 'this',
+    filename: "index.js",
+    path: path.resolve(__dirname, "dist"),
+    libraryTarget: "umd",
+    library: "@grafnode/components"
+  },
+  module: {
+    rules: [
+      {
+        test: /\.jsx?$/,
+        exclude: /node_modules/,
+        use: {
+          loader: "babel-loader"
+        }
+      }
+    ]
+  },
+  externals: {
+    'react': 'react'
+  }
+};