Merge pull request #2174 from RedisInsight/build/feature/RI-4265_Enchance_opening_window_Electron

#RI-4265 - Enhance the window opening in Electron

Author: egor-zalenski

.gitignore

@@ -36,6 +36,7 @@ lerna-debug.log*
 .vscode
 
 # App packaged
+redisinsight/electron/preload.js
 release
 main.prod.js
 main.prod.js.map
@@ -56,6 +57,9 @@ dll
 main.js
 main.js.map
 vendor
+redisinsight/main.js.LICENSE.txt
+redisinsight/main.prod.js.LICENSE.txt
+
 
 # E2E tests report
 /tests/e2e/report

configs/paths.js

@@ -1,11 +1,13 @@
-import path from 'path';
 import webpack from 'webpack';
-import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin';
+import TsconfigPathsPlugins from 'tsconfig-paths-webpack-plugin';
+import webpackPaths from './webpack.paths';
 import { dependencies as externals } from '../redisinsight/package.json';
 
-export default {
+const configuration: webpack.Configuration =  {
   externals: [...Object.keys(externals || {})],
 
+  stats: 'errors-only',
+
   module: {
     rules: [
       {
@@ -22,28 +24,27 @@ export default {
   },
 
   output: {
-    path: path.join(__dirname, '..'),
-    // commonjs2 https://github.com/webpack/webpack/issues/1114
-    libraryTarget: 'commonjs2',
+    path: webpackPaths.riPath,
+    // https://github.com/webpack/webpack/issues/1114
+    library: {
+      type: 'commonjs2',
+    },
   },
 
   resolve: {
     extensions: ['.js', '.jsx', '.json', '.ts', '.tsx', '.scss'],
-    plugins: [
-      new TsconfigPathsPlugin({
-        configFile: path.join(__dirname, '..', 'tsconfig.json'),
-      }),
-    ],
+    modules: [webpackPaths.apiPath, 'node_modules'],
+    plugins: [new TsconfigPathsPlugins()],
     alias: {
-      src: path.resolve(__dirname, '../redisinsight/api/src'),
-      apiSrc: path.resolve(__dirname, '../redisinsight/api/src'),
-      uiSrc: path.resolve(__dirname, '../redisinsight/ui/src'),
+      src: webpackPaths.apiSrcPath,
+      apiSrc: webpackPaths.apiSrcPath,
+      uiSrc: webpackPaths.uiSrcPath,
     },
-    modules: [path.join(__dirname, '../redisinsight/api'), 'node_modules'],
   },
 
   plugins: [
     new webpack.EnvironmentPlugin({
+      NODE_ENV: 'production',
     }),
 
     new webpack.IgnorePlugin({
@@ -81,3 +82,5 @@ export default {
     }),
   ],
 };
+
+export default configuration;

configs/webpack.config.base.js renamed to configs/webpack.config.base.ts

@@ -2,4 +2,4 @@
 /* eslint import/no-unresolved: off, import/no-self-import: off */
 require('@babel/register');
 
-module.exports = require('./webpack.config.renderer.dev.babel').default;
+module.exports = require('./webpack.config.renderer.dev').default;

configs/webpack.config.eslint.js

@@ -1,11 +1,11 @@
 import path from 'path';
 import webpack from 'webpack';
 import { merge } from 'webpack-merge';
-import { toString } from 'lodash'
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
 import baseConfig from './webpack.config.base';
 import DeleteSourceMaps from '../scripts/DeleteSourceMaps';
 import { version } from '../redisinsight/package.json';
+import webpackPaths from './webpack.paths';
 
 DeleteSourceMaps();
 
@@ -23,19 +23,25 @@ export default merge(baseConfig, {
 
   target: 'electron-main',
 
-  entry: './redisinsight/main.dev.ts',
+  entry: {
+    main: path.join(webpackPaths.electronPath, 'main.dev.ts'),
+    preload: path.join(webpackPaths.electronPath, 'preload.ts'),
+  },
 
   resolve: {
     alias: {
-      ['apiSrc']: path.resolve(__dirname, '../redisinsight/api/src'),
-      ['src']: path.resolve(__dirname, '../redisinsight/api/src'),
+      ['apiSrc']: webpackPaths.apiSrcPath,
+      ['src']: webpackPaths.apiSrcPath,
     },
     extensions: ['.tsx', '.ts', '.js', '.jsx'],
   },
 
   output: {
-    path: path.join(__dirname, '../redisinsight'),
-    filename: 'main.prod.js',
+    path: webpackPaths.distMainPath,
+    filename: '[name].js',
+    library: {
+      type: 'umd',
+    },
   },
 
   // optimization: {
@@ -46,10 +52,6 @@ export default merge(baseConfig, {
   //   ],
   // },
 
-  // alias: {
-  //   'apiSrc': path.resolve(__dirname, '../redisinsight/api/src/')
-  // },
-
   plugins: [
     new BundleAnalyzerPlugin({
       analyzerMode: process.env.OPEN_ANALYZER === 'true' ? 'server' : 'disabled',
@@ -71,9 +73,10 @@ export default merge(baseConfig, {
       APP_VERSION: version,
       AWS_BUCKET_NAME: 'AWS_BUCKET_NAME' in process.env ? process.env.AWS_BUCKET_NAME : '',
       SEGMENT_WRITE_KEY: 'SEGMENT_WRITE_KEY' in process.env ? process.env.SEGMENT_WRITE_KEY : 'SOURCE_WRITE_KEY',
-      CONNECTIONS_TIMEOUT_DEFAULT: 'CONNECTIONS_TIMEOUT_DEFAULT' in process.env
-        ? process.env.CONNECTIONS_TIMEOUT_DEFAULT
-        : toString(30 * 1000), // 30 sec
+    }),
+
+    new webpack.DefinePlugin({
+      'process.type': '"browser"',
     }),
   ],
 

configs/webpack.config.main.prod.babel.js renamed to configs/webpack.config.main.prod.ts

@@ -1,8 +1,7 @@
 import webpack from 'webpack';
 import { merge } from 'webpack-merge';
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
-import { toString } from 'lodash'
-import mainProdConfig from './webpack.config.main.prod.babel';
+import mainProdConfig from './webpack.config.main.prod';
 import DeleteSourceMaps from '../scripts/DeleteSourceMaps';
 import { version } from '../redisinsight/package.json';
 
@@ -31,9 +30,6 @@ export default merge(mainProdConfig, {
       APP_VERSION: version,
       AWS_BUCKET_NAME: 'AWS_BUCKET_NAME' in process.env ? process.env.AWS_BUCKET_NAME : '',
       SEGMENT_WRITE_KEY: 'SEGMENT_WRITE_KEY' in process.env ? process.env.SEGMENT_WRITE_KEY : 'SOURCE_WRITE_KEY',
-      CONNECTIONS_TIMEOUT_DEFAULT: 'CONNECTIONS_TIMEOUT_DEFAULT' in process.env
-        ? process.env.CONNECTIONS_TIMEOUT_DEFAULT
-        : toString(30 * 1000), // 30 sec
     }),
   ],
 });

configs/webpack.config.main.stage.babel.js renamed to configs/webpack.config.main.stage.ts

@@ -0,0 +1,64 @@
+import path from 'path';
+import webpack from 'webpack';
+import { merge } from 'webpack-merge';
+import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
+import baseConfig from './webpack.config.base';
+import webpackPaths from './webpack.paths';
+
+const configuration: webpack.Configuration = {
+  devtool: 'inline-source-map',
+
+  mode: 'development',
+
+  target: 'electron-preload',
+
+  entry: path.join(webpackPaths.electronPath, 'preload.ts'),
+
+  output: {
+    path: webpackPaths.dllPath,
+    filename: 'preload.js',
+    library: {
+      type: 'umd',
+    },
+  },
+
+  plugins: [
+    new BundleAnalyzerPlugin({
+      analyzerMode: process.env.ANALYZE === 'true' ? 'server' : 'disabled',
+    }),
+
+    /**
+     * Create global constants which can be configured at compile time.
+     *
+     * Useful for allowing different behaviour between development builds and
+     * release builds
+     *
+     * NODE_ENV should be production so that modules do not perform certain
+     * development checks
+     *
+     * By default, use 'development' as NODE_ENV. This can be overriden with
+     * 'staging', for example, by changing the ENV variables in the npm scripts
+     */
+    new webpack.EnvironmentPlugin({
+      NODE_ENV: 'development',
+    }),
+
+    new webpack.LoaderOptionsPlugin({
+      debug: true,
+    }),
+  ],
+
+  /**
+   * Disables webpack processing of __dirname and __filename.
+   * If you run the bundle in node.js it falls back to these values of node.js.
+   * https://github.com/webpack/webpack/issues/2010
+   */
+  node: {
+    __dirname: false,
+    __filename: false,
+  },
+
+  watch: true,
+};
+
+export default merge(baseConfig, configuration);

configs/webpack.config.preload.dev.ts

@@ -1,17 +1,17 @@
 import webpack from 'webpack';
 import path from 'path';
 import { merge } from 'webpack-merge';
-import { toString } from 'lodash'
 import baseConfig from './webpack.config.base';
+import webpackPaths from './webpack.paths';
 import { dependencies } from '../package.json';
 import { dependencies as dependenciesApi } from '../redisinsight/package.json';
 
 console.log('dependenciesApi', dependenciesApi);
 
-const dist = path.join(__dirname, '../dll');
+const dist = webpackPaths.dllPath;
 
 export default merge(baseConfig, {
-  context: path.join(__dirname, '..'),
+  context: webpackPaths.rootPath,
 
   devtool: 'eval',
 
@@ -24,17 +24,19 @@ export default merge(baseConfig, {
   /**
    * Use `module` from `webpack.config.renderer.dev.js`
    */
-  module: require('./webpack.config.renderer.dev.babel').default.module,
+  module: require('./webpack.config.renderer.dev').default.module,
 
   entry: {
     renderer: [...Object.keys(dependencies || {}), ...Object.keys(dependenciesApi || {})],
   },
 
   output: {
-    library: 'renderer',
     path: dist,
     filename: '[name].dev.dll.js',
-    libraryTarget: 'var',
+    library: {
+      name: 'renderer',
+      type: 'var',
+    },
   },
 
   stats: 'errors-only',
@@ -47,29 +49,16 @@ export default merge(baseConfig, {
 
     new webpack.EnvironmentPlugin({
       NODE_ENV: 'development',
-      APP_ENV: 'electron',
-      API_PREFIX: 'api',
-      BASE_API_URL: 'http://localhost',
-      RESOURCES_BASE_URL: 'http://localhost',
-      SCAN_COUNT_DEFAULT: '500',
-      SCAN_TREE_COUNT_DEFAULT: '10000',
-      PIPELINE_COUNT_DEFAULT: '5',
-      SEGMENT_WRITE_KEY:
-      'SEGMENT_WRITE_KEY' in process.env ? process.env.SEGMENT_WRITE_KEY : 'SOURCE_WRITE_KEY',
-      CONNECTIONS_TIMEOUT_DEFAULT: 'CONNECTIONS_TIMEOUT_DEFAULT' in process.env
-        ? process.env.CONNECTIONS_TIMEOUT_DEFAULT
-        : toString(30 * 1000), // 30 sec
     }),
 
     new webpack.LoaderOptionsPlugin({
       debug: true,
       options: {
-        context: path.join(__dirname, '..'),
+        context: webpackPaths.electronPath,
         output: {
-          path: path.join(__dirname, '../dll'),
+          path: webpackPaths.dllPath,
         },
       },
     }),
-
   ],
 });