From 12bd0f6a049f0b735239885e18bb01b0f6231fe6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?David=20Bocl=C3=A9?= <bcldvd@users.noreply.github.com>
Date: Tue, 23 Aug 2022 09:45:28 +0200
Subject: [PATCH] feat(wc:*): Generate webpack bundle file when creating new
 components (#844)

* feat(wc:*): Generate webpack bundle file when creating new components

* fix

* fix

* feat(wc:global-search): Add bundle script
---
 libs/web-components/global-search/README.md            |  3 ++-
 libs/web-components/global-search/package.json         |  1 +
 libs/web-components/global-search/webpack.config.cjs   | 10 ++++++++++
 libs/web-components/icon-bar/package.json              |  1 +
 libs/web-components/icon-bar/webpack.config.cjs        | 10 ++++++++++
 tools/generators/web-component/files/package.json      |  1 +
 .../generators/web-component/files/webpack.config.cjs  | 10 ++++++++++
 7 files changed, 35 insertions(+), 1 deletion(-)
 create mode 100644 libs/web-components/global-search/webpack.config.cjs
 create mode 100644 libs/web-components/icon-bar/webpack.config.cjs
 create mode 100644 tools/generators/web-component/files/webpack.config.cjs

diff --git a/libs/web-components/global-search/README.md b/libs/web-components/global-search/README.md
index d4d9e19a8..601bb8123 100644
--- a/libs/web-components/global-search/README.md
+++ b/libs/web-components/global-search/README.md
@@ -69,7 +69,8 @@ import '@finastra/global-search';
 A demo code can be find here: [demo](https://github.com/Finastra/finastra-design-system/blob/master/libs/web-components/global-search/demo/index.html)
 
 ```html
-<script type="module" src="https://unpkg.com/@finastra/global-search@latest/dist/src/global-search.js?module"></script>
+<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
+<script src="https://cdn.jsdelivr.net/npm/@finastra/global-search/dist/fds-global-search.js"></script>
 
  <fds-global-search-group 
         slot="searches"
diff --git a/libs/web-components/global-search/package.json b/libs/web-components/global-search/package.json
index eb596c7c8..ab9ba6e51 100644
--- a/libs/web-components/global-search/package.json
+++ b/libs/web-components/global-search/package.json
@@ -12,6 +12,7 @@
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",
   "scripts": {
+    "build": "webpack",
     "build:style": "node ../../../scripts/sass-to-lit-css/index.js src/global-search.scss src/global-search-group/global-search-group.scss src/global-search-page/global-search-page.scss src/global-search-summary/global-search-summary.scss"
   },
   "dependencies": {
diff --git a/libs/web-components/global-search/webpack.config.cjs b/libs/web-components/global-search/webpack.config.cjs
new file mode 100644
index 000000000..88e5e0c0b
--- /dev/null
+++ b/libs/web-components/global-search/webpack.config.cjs
@@ -0,0 +1,10 @@
+const path = require('path');
+const config = require('../base-webpack.config.cjs');
+
+config.entry = path.resolve(__dirname, './src/global-search.ts'),
+config.output = {
+    filename: 'fds-global-search.js',
+    path: path.resolve(__dirname, 'dist'),
+},
+
+module.exports = config;
\ No newline at end of file
diff --git a/libs/web-components/icon-bar/package.json b/libs/web-components/icon-bar/package.json
index 3d3db056d..86baacfbe 100644
--- a/libs/web-components/icon-bar/package.json
+++ b/libs/web-components/icon-bar/package.json
@@ -12,6 +12,7 @@
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",
   "scripts": {
+    "build": "webpack",
     "build:style": "node ../../../scripts/sass-to-lit-css/index.js src/icon-bar.scss src/icon-bar-item.scss"
   },
   "dependencies": {
diff --git a/libs/web-components/icon-bar/webpack.config.cjs b/libs/web-components/icon-bar/webpack.config.cjs
new file mode 100644
index 000000000..d0b25a2dc
--- /dev/null
+++ b/libs/web-components/icon-bar/webpack.config.cjs
@@ -0,0 +1,10 @@
+const path = require('path');
+const config = require('../base-webpack.config.cjs');
+
+config.entry = path.resolve(__dirname, './src/index.ts'),
+config.output = {
+    filename: 'fds-icon-bar.js',
+    path: path.resolve(__dirname, 'dist'),
+},
+
+module.exports = config;
\ No newline at end of file
diff --git a/tools/generators/web-component/files/package.json b/tools/generators/web-component/files/package.json
index dd878e2d6..c2a83df94 100644
--- a/tools/generators/web-component/files/package.json
+++ b/tools/generators/web-component/files/package.json
@@ -12,6 +12,7 @@
   "main": "dist/src/<%= fileName %>.js",
   "module": "dist/src/<%= fileName %>.js",
   "scripts": {
+    "build": "webpack",
     "build:style": "node ../../../scripts/sass-to-lit-css/index.js src/styles.scss"
   },
   "dependencies": {
diff --git a/tools/generators/web-component/files/webpack.config.cjs b/tools/generators/web-component/files/webpack.config.cjs
new file mode 100644
index 000000000..bf052fbb2
--- /dev/null
+++ b/tools/generators/web-component/files/webpack.config.cjs
@@ -0,0 +1,10 @@
+const path = require('path');
+const config = require('../base-webpack.config.cjs');
+
+config.entry = path.resolve(__dirname, './src/<%= fileName %>.ts'),
+config.output = {
+    filename: 'fds-<%= fileName %>.js',
+    path: path.resolve(__dirname, 'dist'),
+},
+
+module.exports = config;
\ No newline at end of file