fix(build): Use "umd" as library target for libraries

Author: Nano Vazquez

README.md

@@ -76,7 +76,7 @@ You can modify the configuration of all the scripts this way (`lint`, `start`, `
 
 ### Start
 
-It spins up a [Webpack DevServer[(https://webpack.js.org/configuration/dev-server/)] with your web app, configured with [Hot Module replacement](https://webpack.js.org/concepts/hot-module-replacement/) and [Cheap Module Source maps](https://webpack.js.org/configuration/devtool/).
+It spins up a [Webpack DevServer](https://webpack.js.org/configuration/dev-server/)] with your web app, configured with [Hot Module replacement](https://webpack.js.org/concepts/hot-module-replacement/) and [Cheap Module Source maps](https://webpack.js.org/configuration/devtool/).
 
 It supports [React](https://reactjs.org/), [TypeScript](https://www.typescriptlang.org/), [SCSS](https://sass-lang.com/guide) and [CSS Modules](https://github.com/css-modules/css-modules). Plus, it automatically types your style files by using the [typings-for-css-modules-loader](https://github.com/TeamSupercell/typings-for-css-modules-loader) library.
 

src/scripts/lint/lint.ts

@@ -70,6 +70,8 @@ console.log(filesToUse !== defaultFilesToUse ? `Found custom rule to identify fi
       process.exit(1);
     }
 
+    // Only fail because of warnings if --max-warnings is sent
+    // See https://eslint.org/docs/user-guide/command-line-interface#-max-warnings 
     const maxWarnings = getArgumentValue(process.argv, 'max-warnings', '-1');
     if (maxWarnings !== '-1' && globalResults.warningCount > parseInt(maxWarnings, 10)) {
       process.exit(1);

src/webpack/resolveExternals.ts

@@ -1,23 +1,23 @@
 import type webpack from 'webpack';
 
 export default (isLibrary: boolean): webpack.ExternalsElement => {
-  if (isLibrary) {
-    // UMD only supports an object
-    return {
-      react: {
-        amd: 'react',
-        commonjs: 'react',
-        commonjs2: 'react',
-        root: 'React',
-      },
-      'react-dom': {
-        amd: 'react-dom',
-        commonjs: 'react-dom',
-        commonjs2: 'react-dom',
-        root: 'ReactDOM',
-      },
-    };
-  }
+  // if (isLibrary) {
+  //   // UMD only supports an object
+  //   return {
+  //     react: {
+  //       amd: 'react',
+  //       commonjs: 'react',
+  //       commonjs2: 'react',
+  //       root: 'React',
+  //     },
+  //     'react-dom': {
+  //       amd: 'react-dom',
+  //       commonjs: 'react-dom',
+  //       commonjs2: 'react-dom',
+  //       root: 'ReactDOM',
+  //     },
+  //   };
+  // }
 
   return {
     react: 'React',

src/webpack/webpack.config.app.ts

@@ -31,6 +31,8 @@ const webpackConfig: webpack.Configuration = {
 
   externals: resolveExternals(false),
 
+  target: 'web',
+
   mode: isDevelopment ? 'development' : 'production',
 
   entry: {

src/webpack/webpack.config.ts

@@ -1,11 +1,11 @@
 import type webpack from 'webpack';
 import webpackConfigApp from './webpack.config.app';
-import webpackConfigLibrary from './webpack.config.library';
+import webpackConfigUiLibrary from './webpack.config.uiLibrary';
 
 // TODO: move this to the main file and convert the webpack to a function
 import getArgumentValue from '../common/getArgumentValue';
 
-const isLibrary = getArgumentValue(process.argv, 'type').toLowerCase() === 'library';
+const isLibrary = getArgumentValue(process.argv, 'type').toLowerCase() === 'ui-library';
 
-const config: webpack.Configuration = isLibrary ? webpackConfigLibrary : webpackConfigApp;
+const config: webpack.Configuration = isLibrary ? webpackConfigUiLibrary : webpackConfigApp;
 export default config;

src/webpack/webpack.config.library.ts renamed to src/webpack/webpack.config.uiLibrary.ts

@@ -19,6 +19,8 @@ const webpackConfig: webpack.Configuration = {
 
   externals: resolveExternals(true),
 
+  target: 'web',
+
   mode: isDevelopment ? 'development' : 'production',
 
   entry: {
@@ -28,7 +30,6 @@ const webpackConfig: webpack.Configuration = {
   output: {
     filename: '[name].min.js',
     path: OUTPUT_PATH,
-    libraryTarget: 'commonjs2',
   },
 
   resolve: {