make build esm compatible wip

CDEBase · Nov 10, 2022 · 192cbcf · 192cbcf
1 parent 25481e6
commit 192cbcf
Show file tree

Hide file tree

Showing 11 changed files with 203 additions and 178 deletions.
diff --git a/build.config.js → build.config.cjs b/build.config.js → build.config.cjs
diff --git a/package.json b/package.json
@@ -234,6 +234,7 @@
     "envalid": "~7.3.1",
     "enzyme": "^3.11.0",
     "esbuild": "^0.15.13",
+    "esbuild-loader": "^2.19.0",
     "eslint": "^8.27.0",
     "eslint-config-airbnb-typescript": "^17.0.0",
     "eslint-config-prettier": "^8.5.0",

diff --git a/packages-modules/counter/browser/package.json b/packages-modules/counter/browser/package.json
@@ -5,6 +5,7 @@
   "license": "ISC",
   "author": "CDMBase LLC",
   "main": "lib/index.js",
+  "type": "module",
   "typings": "lib/index.d.ts",
   "scripts": {
     "build": "yarn build:clean && yarn build:lib",

diff --git a/servers/frontend-server/babel.config.js → servers/frontend-server/babel.config.cjs b/servers/frontend-server/babel.config.js → servers/frontend-server/babel.config.cjs
diff --git a/servers/frontend-server/build.config.js → servers/frontend-server/build.config.cjs b/servers/frontend-server/build.config.js → servers/frontend-server/build.config.cjs
@@ -1,5 +1,5 @@
 const config = {
-    ...require('../../build.config'),
+    ...require('../../build.config.cjs'),
     __CLIENT__: true,
     __SERVER__: false,
     __DEV__: process.env.NODE_ENV !== 'production',

diff --git a/servers/frontend-server/package.json b/servers/frontend-server/package.json
@@ -14,9 +14,10 @@
   "license": "MIT",
   "author": "CDMBase LLC",
   "main": "index.js",
+  "type": "module",
   "scripts": {
     "prebuild": "yarn build:clean",
-    "build": "cross-env NODE_ENV=production webpack",
+    "build": "cross-env NODE_ENV=production webpack -c webpack.config.cjs",
     "build:clean": "rimraf dist .awcache",
     "build:debug": "cross-env DEBUGGING=true NODE_ENV=production webpack",
     "build:debug:verbose": "yarn build:debug -- -v",

diff --git a/servers/frontend-server/src/backend/app.ts b/servers/frontend-server/src/backend/app.ts
@@ -10,13 +10,13 @@ import { logger } from '@cdm-logger/server';
 
 import './server';
 
-process.on('uncaughtException', (ex) => {
-    logger.error(ex);
+process.on('uncaughtException', (ex: Error) => {
+    logger.error(ex, 'uncaughtException');
     process.exit(1);
 });
 
-process.on('unhandledRejection', (reason) => {
-    logger.error(reason);
+process.on('unhandledRejection', (reason: Error) => {
+    logger.error(reason, 'unhandledRejection');
 });
 
 if ((module as any).hot) {

diff --git a/servers/frontend-server/tsconfig.json b/servers/frontend-server/tsconfig.json
@@ -5,6 +5,9 @@
     "esModuleInterop": true,
     "sourceMap": true,
     "declaration": false,
+    "lib": ["es2021"],
+    "module": "commonjs",
+    "target": "es2021",
     "jsx": "react",
     "outDir": "./dist",
     "rootDir": "./src",

diff --git a/servers/frontend-server/webpack.config.js → servers/frontend-server/webpack.config.cjs b/servers/frontend-server/webpack.config.js → servers/frontend-server/webpack.config.cjs
@@ -12,11 +12,11 @@ const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
 const CompressionPlugin = require('compression-webpack-plugin');
 const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
 const zlib = require('zlib');
-const ServerConfig = require('../../tools/webpack/server.config');
+const ServerConfig = require('../../tools/webpack/server.config.cjs');
 
 const bundleStats = process.env.BUNDLE_STATS || false;
 
-const buildConfig = require('./build.config');
+const buildConfig = require('./build.config.cjs');
 
 const modulenameExtra = process.env.MODULENAME_EXTRA ? `${process.env.MODULENAME_EXTRA}|` : '';
 const modulenameRegex = new RegExp(`node_modules(?![\\\\/](${modulenameExtra}@sample-stack)).*`);
@@ -271,7 +271,9 @@ const config = {
     },
 };
 
-const ServersConfig = [config];
+// const ServersConfig = [config];
+const ServersConfig = [];
+
 if (buildConfig.__SSR__) {
     ServersConfig.push(
         ServerConfig({

diff --git a/tools/webpack/server.config.js → tools/webpack/server.config.cjs b/tools/webpack/server.config.js → tools/webpack/server.config.cjs
@@ -15,7 +15,7 @@ const modulenameRegex = new RegExp(
 const config = ({ buildConfig, indexFilePath, currentDir }) => ({
     entry: {
         index: (process.env.NODE_ENV !== 'production' ? ['webpack/hot/poll?200'] : []).concat([
-            'raf/polyfill',
+            // 'raf/polyfill',
             indexFilePath,
         ]),
     },
@@ -65,8 +65,13 @@ const config = ({ buildConfig, indexFilePath, currentDir }) => ({
             {
                 test: /\.[tj]sx?$/,
                 use: {
-                    loader: 'babel-loader',
-                    options: { babelrc: true, rootMode: 'upward-optional' },
+                    // loader: 'babel-loader',
+                    // options: { babelrc: true, rootMode: 'upward-optional' },
+                    loader: 'esbuild-loader',
+                    options: {
+                        loader: 'tsx',
+                        target: 'es2021'
+                    }
                 },
             },
             { test: /locales/, use: { loader: '@alienfast/i18next-loader' } },
@@ -94,20 +99,26 @@ const config = ({ buildConfig, indexFilePath, currentDir }) => ({
     watchOptions: { ignored: /dist/ },
     output: {
         pathinfo: false,
-        filename: 'main.js',
+        filename: 'index.js',
         path: path.join(currentDir, 'dist'),
+        library: {
+            type: "module",
+        },
         publicPath: '/',
         sourceMapFilename: '[name].[chunkhash].js.map',
     },
+    experiments: {
+        outputModule: true,
+      },
     devtool: process.env.NODE_ENV === 'production' ? 'nosources-source-map' : 'cheap-module-source-map',
     mode: process.env.NODE_ENV || 'development',
     performance: { hints: false },
     plugins: (process.env.NODE_ENV !== 'production'
         ? [
-              //  new Dotenv(),
-              new webpack.HotModuleReplacementPlugin(),
-              new NodemonPlugin({ script: './dist/index.js' }),
-          ]
+            //  new Dotenv(),
+            new webpack.HotModuleReplacementPlugin(),
+            new NodemonPlugin({ script: './dist/index.js' }),
+        ]
         : []
     ).concat([
         new CleanWebpackPlugin({ cleanOnceBeforeBuildPatterns: ['dist'] }),
@@ -119,14 +130,14 @@ const config = ({ buildConfig, indexFilePath, currentDir }) => ({
                 })),
             ),
         ),
-        new CopyWebpackPlugin({
-            patterns: [
-                {
-                    from: '../../tools/esm-wrapper.js',
-                    to: 'index.js',
-                },
-            ],
-        }),
+        // new CopyWebpackPlugin({
+        //     patterns: [
+        //         {
+        //             from: '../../tools/esm-wrapper.js',
+        //             to: 'index.js',
+        //         },
+        //     ],
+        // }),
     ]),
     target: 'node',
     externals: [