From 5ab998caa6a39c1585dcbdf92c8d9043619b98c2 Mon Sep 17 00:00:00 2001 From: Dano Morrison Date: Sun, 9 Aug 2020 13:16:40 -0400 Subject: [PATCH] updated internals and webpack configs --- configs/webpack.config.base.js | 20 +-- configs/webpack.config.main.prod.babel.js | 22 +-- configs/webpack.config.renderer.dev.babel.js | 129 +++++++++--------- .../webpack.config.renderer.dev.dll.babel.js | 22 +-- configs/webpack.config.renderer.prod.babel.js | 122 +++++++++-------- internals/scripts/BabelRegister.js | 2 +- internals/scripts/CheckNativeDep.js | 4 +- internals/scripts/ElectronRebuild.js | 2 +- 8 files changed, 162 insertions(+), 161 deletions(-) diff --git a/configs/webpack.config.base.js b/configs/webpack.config.base.js index 856c9363..c4c004a7 100644 --- a/configs/webpack.config.base.js +++ b/configs/webpack.config.base.js @@ -17,17 +17,17 @@ export default { use: { loader: 'babel-loader', options: { - cacheDirectory: true - } - } - } - ] + cacheDirectory: true, + }, + }, + }, + ], }, output: { path: path.join(__dirname, '..', 'app'), // https://github.com/webpack/webpack/issues/1114 - libraryTarget: 'commonjs2' + libraryTarget: 'commonjs2', }, /** @@ -35,14 +35,14 @@ export default { */ resolve: { extensions: ['.js', '.jsx', '.json', '.ts', '.tsx'], - modules: [path.join(__dirname, '..', 'app'), 'node_modules'] + modules: [path.join(__dirname, '..', 'app'), 'node_modules'], }, plugins: [ new webpack.EnvironmentPlugin({ - NODE_ENV: 'production' + NODE_ENV: 'production', }), - new webpack.NamedModulesPlugin() - ] + new webpack.NamedModulesPlugin(), + ], }; diff --git a/configs/webpack.config.main.prod.babel.js b/configs/webpack.config.main.prod.babel.js index 06aed1f5..c50767c3 100644 --- a/configs/webpack.config.main.prod.babel.js +++ b/configs/webpack.config.main.prod.babel.js @@ -4,7 +4,7 @@ import path from 'path'; import webpack from 'webpack'; -import merge from 'webpack-merge'; +import { merge } from 'webpack-merge'; import TerserPlugin from 'terser-webpack-plugin'; import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'; import baseConfig from './webpack.config.base'; @@ -14,7 +14,7 @@ import DeleteSourceMaps from '../internals/scripts/DeleteSourceMaps'; CheckNodeEnv('production'); DeleteSourceMaps(); -export default merge.smart(baseConfig, { +export default merge(baseConfig, { devtool: process.env.DEBUG_PROD === 'true' ? 'source-map' : 'none', mode: 'production', @@ -25,7 +25,7 @@ export default merge.smart(baseConfig, { output: { path: path.join(__dirname, '..'), - filename: './app/main.prod.js' + filename: './app/main.prod.js', }, optimization: { @@ -35,16 +35,16 @@ export default merge.smart(baseConfig, { new TerserPlugin({ parallel: true, sourceMap: true, - cache: true - }) - ] + cache: true, + }), + ], }, plugins: [ new BundleAnalyzerPlugin({ analyzerMode: process.env.OPEN_ANALYZER === 'true' ? 'server' : 'disabled', - openAnalyzer: process.env.OPEN_ANALYZER === 'true' + openAnalyzer: process.env.OPEN_ANALYZER === 'true', }), /** @@ -60,8 +60,8 @@ export default merge.smart(baseConfig, { NODE_ENV: 'production', DEBUG_PROD: false, START_MINIMIZED: false, - E2E_BUILD: false - }) + E2E_BUILD: false, + }), ], /** @@ -71,6 +71,6 @@ export default merge.smart(baseConfig, { */ node: { __dirname: false, - __filename: false - } + __filename: false, + }, }); diff --git a/configs/webpack.config.renderer.dev.babel.js b/configs/webpack.config.renderer.dev.babel.js index e2511ea0..093ba545 100644 --- a/configs/webpack.config.renderer.dev.babel.js +++ b/configs/webpack.config.renderer.dev.babel.js @@ -9,9 +9,8 @@ import path from 'path'; import fs from 'fs'; import webpack from 'webpack'; import chalk from 'chalk'; -import merge from 'webpack-merge'; +import { merge } from 'webpack-merge'; import { spawn, execSync } from 'child_process'; -import { TypedCssModulesPlugin } from 'typed-css-modules-webpack-plugin'; import baseConfig from './webpack.config.base'; import CheckNodeEnv from '../internals/scripts/CheckNodeEnv'; @@ -41,7 +40,7 @@ if (!requiredByDLLConfig && !(fs.existsSync(dll) && fs.existsSync(manifest))) { execSync('yarn build-dll'); } -export default merge.smart(baseConfig, { +export default merge(baseConfig, { devtool: 'inline-source-map', mode: 'development', @@ -49,15 +48,17 @@ export default merge.smart(baseConfig, { target: 'electron-renderer', entry: [ + 'core-js', + 'regenerator-runtime/runtime', ...(process.env.PLAIN_HMR ? [] : ['react-hot-loader/patch']), `webpack-dev-server/client?http://localhost:${port}/`, 'webpack/hot/only-dev-server', - require.resolve('../app/index.tsx') + require.resolve('../app/index.tsx'), ], output: { publicPath: `http://localhost:${port}/dist/`, - filename: 'renderer.dev.js' + filename: 'renderer.dev.js', }, module: { @@ -66,73 +67,73 @@ export default merge.smart(baseConfig, { test: /\.global\.css$/, use: [ { - loader: 'style-loader' + loader: 'style-loader', }, { loader: 'css-loader', options: { - sourceMap: true - } - } - ] + sourceMap: true, + }, + }, + ], }, { test: /^((?!\.global).)*\.css$/, use: [ { - loader: 'style-loader' + loader: 'style-loader', }, { loader: 'css-loader', options: { modules: { - localIdentName: '[name]__[local]__[hash:base64:5]' + localIdentName: '[name]__[local]__[hash:base64:5]', }, sourceMap: true, - importLoaders: 1 - } - } - ] + importLoaders: 1, + }, + }, + ], }, // SASS support - compile all .global.scss files and pipe it to style.css { test: /\.global\.(scss|sass)$/, use: [ { - loader: 'style-loader' + loader: 'style-loader', }, { loader: 'css-loader', options: { - sourceMap: true - } + sourceMap: true, + }, }, { - loader: 'sass-loader' - } - ] + loader: 'sass-loader', + }, + ], }, // SASS support - compile all other .scss files and pipe it to style.css { test: /^((?!\.global).)*\.(scss|sass)$/, use: [ { - loader: 'style-loader' + loader: 'typings-for-css-modules-loader', }, { - loader: 'css-loader', + loader: 'typings-for-css-modules-loader', options: { modules: { - localIdentName: '[name]__[local]__[hash:base64:5]' + localIdentName: '[name]__[local]__[hash:base64:5]', }, sourceMap: true, - importLoaders: 1 - } + importLoaders: 1, + }, }, { - loader: 'sass-loader' - } - ] + loader: 'sass-loader', + }, + ], }, // WOFF Font { @@ -141,9 +142,9 @@ export default merge.smart(baseConfig, { loader: 'url-loader', options: { limit: 10000, - mimetype: 'application/font-woff' - } - } + mimetype: 'application/font-woff', + }, + }, }, // WOFF2 Font { @@ -152,9 +153,9 @@ export default merge.smart(baseConfig, { loader: 'url-loader', options: { limit: 10000, - mimetype: 'application/font-woff' - } - } + mimetype: 'application/font-woff', + }, + }, }, // TTF Font { @@ -163,14 +164,14 @@ export default merge.smart(baseConfig, { loader: 'url-loader', options: { limit: 10000, - mimetype: 'application/octet-stream' - } - } + mimetype: 'application/octet-stream', + }, + }, }, // EOT Font { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, - use: 'file-loader' + use: 'file-loader', }, // SVG Font { @@ -179,21 +180,21 @@ export default merge.smart(baseConfig, { loader: 'url-loader', options: { limit: 10000, - mimetype: 'image/svg+xml' - } - } + mimetype: 'image/svg+xml', + }, + }, }, // Common Image Formats { test: /\.(?:ico|gif|png|jpg|jpeg|webp)$/, - use: 'url-loader' - } - ] + use: 'url-loader', + }, + ], }, resolve: { alias: { - 'react-dom': '@hot-loader/react-dom' - } + 'react-dom': '@hot-loader/react-dom', + }, }, plugins: [ requiredByDLLConfig @@ -201,15 +202,11 @@ export default merge.smart(baseConfig, { : new webpack.DllReferencePlugin({ context: path.join(__dirname, '..', 'dll'), manifest: require(manifest), - sourceType: 'var' + sourceType: 'var', }), new webpack.HotModuleReplacementPlugin({ - multiStep: true - }), - - new TypedCssModulesPlugin({ - globPattern: 'app/**/*.{css,scss,sass}' + multiStep: true, }), new webpack.NoEmitOnErrorsPlugin(), @@ -227,24 +224,24 @@ export default merge.smart(baseConfig, { * 'staging', for example, by changing the ENV variables in the npm scripts */ new webpack.EnvironmentPlugin({ - NODE_ENV: 'development' + NODE_ENV: 'development', }), new webpack.LoaderOptionsPlugin({ - debug: true - }) + debug: true, + }), ], node: { __dirname: false, - __filename: false + __filename: false, }, devServer: { port, publicPath, compress: true, - noInfo: true, + noInfo: false, stats: 'errors-only', inline: true, lazy: false, @@ -254,11 +251,11 @@ export default merge.smart(baseConfig, { watchOptions: { aggregateTimeout: 300, ignored: /node_modules/, - poll: 100 + poll: 100, }, historyApiFallback: { verbose: true, - disableDotRule: false + disableDotRule: false, }, before() { if (process.env.START_HOT) { @@ -266,11 +263,11 @@ export default merge.smart(baseConfig, { spawn('npm', ['run', 'start-main-dev'], { shell: true, env: process.env, - stdio: 'inherit' + stdio: 'inherit', }) - .on('close', code => process.exit(code)) - .on('error', spawnError => console.error(spawnError)); + .on('close', (code) => process.exit(code)) + .on('error', (spawnError) => console.error(spawnError)); } - } - } + }, + }, }); diff --git a/configs/webpack.config.renderer.dev.dll.babel.js b/configs/webpack.config.renderer.dev.dll.babel.js index 99fc2f30..fa0b172c 100644 --- a/configs/webpack.config.renderer.dev.dll.babel.js +++ b/configs/webpack.config.renderer.dev.dll.babel.js @@ -4,7 +4,7 @@ import webpack from 'webpack'; import path from 'path'; -import merge from 'webpack-merge'; +import { merge } from 'webpack-merge'; import baseConfig from './webpack.config.base'; import { dependencies } from '../package.json'; import CheckNodeEnv from '../internals/scripts/CheckNodeEnv'; @@ -13,7 +13,7 @@ CheckNodeEnv('development'); const dist = path.join(__dirname, '..', 'dll'); -export default merge.smart(baseConfig, { +export default merge(baseConfig, { context: path.join(__dirname, '..'), devtool: 'eval', @@ -30,20 +30,20 @@ export default merge.smart(baseConfig, { module: require('./webpack.config.renderer.dev.babel').default.module, entry: { - renderer: Object.keys(dependencies || {}) + renderer: Object.keys(dependencies || {}), }, output: { library: 'renderer', path: dist, filename: '[name].dev.dll.js', - libraryTarget: 'var' + libraryTarget: 'var', }, plugins: [ new webpack.DllPlugin({ path: path.join(dist, '[name].json'), - name: '[name]' + name: '[name]', }), /** @@ -56,7 +56,7 @@ export default merge.smart(baseConfig, { * development checks */ new webpack.EnvironmentPlugin({ - NODE_ENV: 'development' + NODE_ENV: 'development', }), new webpack.LoaderOptionsPlugin({ @@ -64,9 +64,9 @@ export default merge.smart(baseConfig, { options: { context: path.join(__dirname, '..', 'app'), output: { - path: path.join(__dirname, '..', 'dll') - } - } - }) - ] + path: path.join(__dirname, '..', 'dll'), + }, + }, + }), + ], }); diff --git a/configs/webpack.config.renderer.prod.babel.js b/configs/webpack.config.renderer.prod.babel.js index 602119ce..70d8593b 100644 --- a/configs/webpack.config.renderer.prod.babel.js +++ b/configs/webpack.config.renderer.prod.babel.js @@ -7,7 +7,7 @@ import webpack from 'webpack'; import MiniCssExtractPlugin from 'mini-css-extract-plugin'; import OptimizeCSSAssetsPlugin from 'optimize-css-assets-webpack-plugin'; import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'; -import merge from 'webpack-merge'; +import { merge } from 'webpack-merge'; import TerserPlugin from 'terser-webpack-plugin'; import baseConfig from './webpack.config.base'; import CheckNodeEnv from '../internals/scripts/CheckNodeEnv'; @@ -16,19 +16,23 @@ import DeleteSourceMaps from '../internals/scripts/DeleteSourceMaps'; CheckNodeEnv('production'); DeleteSourceMaps(); -export default merge.smart(baseConfig, { +export default merge(baseConfig, { devtool: process.env.DEBUG_PROD === 'true' ? 'source-map' : 'none', mode: 'production', - target: 'electron-preload', + target: process.env.E2E_BUILD ? 'electron-renderer' : 'electron-preload', - entry: path.join(__dirname, '..', 'app/index.tsx'), + entry: [ + 'core-js', + 'regenerator-runtime/runtime', + path.join(__dirname, '..', 'app/index.tsx'), + ], output: { path: path.join(__dirname, '..', 'app/dist'), publicPath: './dist/', - filename: 'renderer.prod.js' + filename: 'renderer.prod.js', }, module: { @@ -40,81 +44,81 @@ export default merge.smart(baseConfig, { { loader: MiniCssExtractPlugin.loader, options: { - publicPath: './' - } + publicPath: './', + }, }, { loader: 'css-loader', options: { - sourceMap: true - } - } - ] + sourceMap: true, + }, + }, + ], }, // Pipe other styles through css modules and append to style.css { test: /^((?!\.global).)*\.css$/, use: [ { - loader: MiniCssExtractPlugin.loader + loader: MiniCssExtractPlugin.loader, }, { loader: 'css-loader', options: { modules: { - localIdentName: '[name]__[local]__[hash:base64:5]' + localIdentName: '[name]__[local]__[hash:base64:5]', }, - sourceMap: true - } - } - ] + sourceMap: true, + }, + }, + ], }, // Add SASS support - compile all .global.scss files and pipe it to style.css { test: /\.global\.(scss|sass)$/, use: [ { - loader: MiniCssExtractPlugin.loader + loader: MiniCssExtractPlugin.loader, }, { loader: 'css-loader', options: { sourceMap: true, - importLoaders: 1 - } + importLoaders: 1, + }, }, { loader: 'sass-loader', options: { - sourceMap: true - } - } - ] + sourceMap: true, + }, + }, + ], }, // Add SASS support - compile all other .scss files and pipe it to style.css { test: /^((?!\.global).)*\.(scss|sass)$/, use: [ { - loader: MiniCssExtractPlugin.loader + loader: MiniCssExtractPlugin.loader, }, { loader: 'css-loader', options: { modules: { - localIdentName: '[name]__[local]__[hash:base64:5]' + localIdentName: '[name]__[local]__[hash:base64:5]', }, importLoaders: 1, - sourceMap: true - } + sourceMap: true, + }, }, { loader: 'sass-loader', options: { - sourceMap: true - } - } - ] + sourceMap: true, + }, + }, + ], }, // WOFF Font { @@ -123,9 +127,9 @@ export default merge.smart(baseConfig, { loader: 'url-loader', options: { limit: 10000, - mimetype: 'application/font-woff' - } - } + mimetype: 'application/font-woff', + }, + }, }, // WOFF2 Font { @@ -134,9 +138,9 @@ export default merge.smart(baseConfig, { loader: 'url-loader', options: { limit: 10000, - mimetype: 'application/font-woff' - } - } + mimetype: 'application/font-woff', + }, + }, }, // TTF Font { @@ -145,14 +149,14 @@ export default merge.smart(baseConfig, { loader: 'url-loader', options: { limit: 10000, - mimetype: 'application/octet-stream' - } - } + mimetype: 'application/octet-stream', + }, + }, }, // EOT Font { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, - use: 'file-loader' + use: 'file-loader', }, // SVG Font { @@ -161,16 +165,16 @@ export default merge.smart(baseConfig, { loader: 'url-loader', options: { limit: 10000, - mimetype: 'image/svg+xml' - } - } + mimetype: 'image/svg+xml', + }, + }, }, // Common Image Formats { test: /\.(?:ico|gif|png|jpg|jpeg|webp)$/, - use: 'url-loader' - } - ] + use: 'url-loader', + }, + ], }, optimization: { @@ -180,17 +184,17 @@ export default merge.smart(baseConfig, { new TerserPlugin({ parallel: true, sourceMap: true, - cache: true + cache: true, }), new OptimizeCSSAssetsPlugin({ cssProcessorOptions: { map: { inline: false, - annotation: true - } - } - }) - ] + annotation: true, + }, + }, + }), + ], }, plugins: [ @@ -206,17 +210,17 @@ export default merge.smart(baseConfig, { new webpack.EnvironmentPlugin({ NODE_ENV: 'production', DEBUG_PROD: false, - E2E_BUILD: false + E2E_BUILD: false, }), new MiniCssExtractPlugin({ - filename: 'style.css' + filename: 'style.css', }), new BundleAnalyzerPlugin({ analyzerMode: process.env.OPEN_ANALYZER === 'true' ? 'server' : 'disabled', - openAnalyzer: process.env.OPEN_ANALYZER === 'true' - }) - ] + openAnalyzer: process.env.OPEN_ANALYZER === 'true', + }), + ], }); diff --git a/internals/scripts/BabelRegister.js b/internals/scripts/BabelRegister.js index 9608e76e..bf41c5af 100644 --- a/internals/scripts/BabelRegister.js +++ b/internals/scripts/BabelRegister.js @@ -2,5 +2,5 @@ const path = require('path'); require('@babel/register')({ extensions: ['.es6', '.es', '.jsx', '.js', '.mjs', '.ts', '.tsx'], - cwd: path.join(__dirname, '..', '..') + cwd: path.join(__dirname, '..', '..'), }); diff --git a/internals/scripts/CheckNativeDep.js b/internals/scripts/CheckNativeDep.js index 1acf39ec..1f0c4390 100644 --- a/internals/scripts/CheckNativeDep.js +++ b/internals/scripts/CheckNativeDep.js @@ -7,7 +7,7 @@ if (dependencies) { const dependenciesKeys = Object.keys(dependencies); const nativeDeps = fs .readdirSync('node_modules') - .filter(folder => fs.existsSync(`node_modules/${folder}/binding.gyp`)); + .filter((folder) => fs.existsSync(`node_modules/${folder}/binding.gyp`)); try { // Find the reason for why the dependency is installed. If it is installed // because of a devDependency then that is okay. Warn when it is installed @@ -16,7 +16,7 @@ if (dependencies) { execSync(`npm ls ${nativeDeps.join(' ')} --json`).toString() ); const rootDependencies = Object.keys(dependenciesObject); - const filteredRootDependencies = rootDependencies.filter(rootDependency => + const filteredRootDependencies = rootDependencies.filter((rootDependency) => dependenciesKeys.includes(rootDependency) ); if (filteredRootDependencies.length > 0) { diff --git a/internals/scripts/ElectronRebuild.js b/internals/scripts/ElectronRebuild.js index 2bff677c..e89a4f66 100644 --- a/internals/scripts/ElectronRebuild.js +++ b/internals/scripts/ElectronRebuild.js @@ -17,6 +17,6 @@ if ( : electronRebuildCmd; execSync(cmd, { cwd: path.join(__dirname, '..', '..', 'app'), - stdio: 'inherit' + stdio: 'inherit', }); }