Web: Front End: Save discoveries to run ESBuild

ESBuild would be much faster than Webpack to researching what it would
take to run it.
Would need to run Typescript validation separately.

limelight_webapp/front_end/A_Fake_JS_Trigger_TypescriptValidation.ts

@@ -0,0 +1,8 @@
+/**
+ * A_Fake_JS_Trigger_TypescriptValidation.ts
+ *
+ * File to have something webpack can point to to start Typescript validation of all files
+ */
+
+
+// force_error = 1

limelight_webapp/front_end/esbuild_proteinViewPage_RootLaunch_LoggedInUsers.sh

@@ -3,13 +3,33 @@
 
 #   install esbuild first (use npm)
 
-#  !!!!  The result does NOT load in the browser. 
-#		Error in compiled Handlebars Precompiled Templates:   
-#			'define' not found.  'define' at the start of the precompiled template
+#         npm install --save-exact --save-dev esbuild
+#           per https://esbuild.github.io/getting-started/
+
 
 ./node_modules/.bin/esbuild \
 ./src/js/page_js/data_pages/project_search_ids_driven_pages/protein_page/protein_page_root/proteinViewPage_RootLaunch_LoggedInUsers.ts  \
---bundle  --sourcemap --target=chrome88  \
- --define:process.env.NODE_ENV=\"production\"  \
---outfile=./webpack_build_output/js_generated_bundles/data_pages/proteinViewPage_RootLaunch_LoggedInUsers-bundle.js
+ --bundle --sourcemap --target=es2023  \
+  '--define:process.env.NODE_ENV="production"' \
+ --outfile=./webpack_build_output/js_generated_bundles/data_pages/proteinViewPage_RootLaunch_LoggedInUsers-bundle.js
+
+#   without  --minify  the NODE_ENV="development"
+
+#  --minify   also sets NODE_ENV=production
+
+#  attempt to build with NODE_ENV=production but NOT minify:
+
+#   IF MINIFY see:   ZZ__Tool_JS_StackTrace_And_SourceMap_Get_Source_LineNumbers.txt   https://github.com/mifi/stacktracify
+
+###################
+
+#       try:
+##  '--define:process.env.NODE_ENV="production"'
+
+#     This builds and results in production mode but fails in the browser with
+#       "installHook.js:1 Uncaught Error: React is running in production mode, but dead code elimination has not been applied. Read how to correctly configure React for production"
+#     The app appears to run fine but since an error is detected the Limelight code shows the overlay "Error in Page Code"
+
+#       Google search of error leads to https://github.com/evanw/esbuild/issues/2353
 
+###################

limelight_webapp/front_end/webpack.config.js

@@ -28,7 +28,7 @@ const module_MAIN = {
 	rules:[
 		{
 			test: /\.(ts|tsx)$/,
-			exclude: /(node_modules|bower_components)/,
+			exclude: /(node_modules|bower_components|typescript_compile_output|webpack_build_output)/,
 			use: [
 				{
 					loader: 'ts-loader',
@@ -41,7 +41,7 @@ const module_MAIN = {
 		},
 		{
 			test: /\.(js|jsx)$/,
-			exclude: /(node_modules|bower_components)/,
+			exclude: /(node_modules|bower_components|typescript_compile_output|webpack_build_output)/,
 			loader: "babel-loader",
 			options: {  } // Do not put this inside options: { } :  { presets: ["@babel/env"] }
 		},
@@ -312,6 +312,18 @@ const mainConfig = (env, argv) => {
 		}
 	}
 
+	// {  //  Code change if build bundles using different program to also run webpack to run Typescript to validate files
+	//
+	// 	const entry_New = {
+	// 		'styles': './src/styles/global.scss',
+	// 		'A_Fake_JS_Trigger_TypescriptValidation.ts': './A_Fake_JS_Trigger_TypescriptValidation.ts'
+	// 	}
+	//
+	// 	entry = entry_New;
+
+	// 	console.warn( "NOT building JS Bundles using Webpack. ONLY Doing Typscript Validation" )
+	// }
+
 
 	return {
 		name: "mainConfig",

limelight_webapp/src/main/webapp/WEB-INF/jsp/jsp_includes_head_section/head_section_include_every_page.jsp

@@ -33,7 +33,7 @@ head_section_include_every_page.jsp
     	content="script-src
     		'self' 
     		'sha256-LtIWLBFFzfYXdIGWJ2t/yMJVIYyKlWYs6JwRq0ESN9U=' <%-- inline script in this file for IE testing. --%>
-    		'sha256-zFC+///Xk4FAbxdUL7/FfF4qw3h5uHyU1+/S3dKmzLg=' <%-- inline script in this file for Page Error reporting. --%>
+    		'sha256-319wADTDxjEQJFL1G+2TSXPRFK4SR/WciC6jFGqf3j8=' <%-- inline script in this file for Page Error reporting. --%>
     		https://www.gstatic.com/  <%-- Google Charts Loader and Google Recaptcha data loaded from here --%>
     		'unsafe-eval'             <%-- Required for Plotly WebGL detection and Google Charts (Google Charts currently NOT used) --%> 
     		https://www.googletagmanager.com/gtag/js  <%-- Google Analytics --%>
@@ -87,6 +87,10 @@ head_section_include_every_page.jsp
 
 </c:if>
 
+<%--  This error message comes from React when build using esbuild '--define:process.env.NODE_ENV="production"' and not --minify.  The page seems to work fine so ignore.  --%>
+<script type="text/text" id="header_section_onerror_error_message_to_ignore" >React is running in production mode, but dead code elimination has not been applied. Read how to correctly configure React for production</script>
+
+
 
  <%--  !!!!!  WARNING  !!!!!!:   Any changes to this script requires changing the hash code in "Content-Security-Policy"
  
@@ -99,7 +103,16 @@ head_section_include_every_page.jsp
 		'inline script in this file for Page Error reporting'
  --%>
      <script type="text/javascript" >
+     
+     	let header_section_onerror_error_message_to_ignore_String = ""
+
+     	const header_section_onerror_error_message_to_ignoreDOM = document.getElementById("header_section_onerror_error_message_to_ignore")
+     	if ( header_section_onerror_error_message_to_ignoreDOM ) {
+     		header_section_onerror_error_message_to_ignore_String = header_section_onerror_error_message_to_ignoreDOM.innerText
 
+            console.log( " value from DOM ID 'header_section_onerror_error_message_to_ignore': " + header_section_onerror_error_message_to_ignore_String )
+        }
+     
          window.onerror = function(message, source, lineno, colno, error) {
 
              console.warn("In window.onerror function:")
@@ -108,6 +121,13 @@ head_section_include_every_page.jsp
              console.warn("window.onerror lineno:", lineno)
              console.warn("window.onerror colno:", colno)
              console.warn("window.onerror error:", error)
+             
+             if ( message.includes( header_section_onerror_error_message_to_ignore_String ) ) {
+            	 
+            	 //  
+            	 
+            	 return // EARLY RETURN
+             }
 
              window.setTimeout( function () {