@lipemat/js-boilerplate 10.12.0 → 10.13.0

package/bin/lipemat-js-boilerplate.js

@@ -13,6 +13,7 @@ const nodeArgs = scriptIndex > 0 ? args.slice( 0, scriptIndex ) : [];
 
 const TS_CONVERTED_SCRIPTS = [
 	'analyze',
+	'dist',
 	'test',
 	'lint',
 	'validate-css-modules',
@@ -27,7 +28,7 @@ switch ( script ) {
 	case 'start':
 	case 'test':
 	case 'validate-css-modules': {
-		// If the ts-node command is not available install it globally.
+		// If the ts-node command is not available, install it globally.
 		if ( spawn.sync( 'ts-node', [ '-v' ] ).error ) {
 			console.log( 'Installing ts-node globally.' );
 			spawn.sync( 'npm', [ 'install', '-g', 'ts-node' ] );

package/config/dev-server.config.js

@@ -1,37 +1,42 @@
-const fs = require( 'fs' );
-const packageConfig = require( '../helpers/package-config' );
-
-const url = new URL( packageConfig.url );
-
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const fs_1 = __importDefault(require("fs"));
+const package_config_1 = require("../helpers/package-config");
+const packageConfig = (0, package_config_1.getPackageConfig)();
+const url = new URL(packageConfig.url);
 let server = 'https:' === url.protocol ? 'https' : 'http';
 // Load local certificates for https during development.
-if ( 'object' === typeof ( packageConfig.certificates ) ) {
-	server = {
-		type: 'https',
-		options: {
-			cert: fs.readFileSync( packageConfig.certificates.cert ),
-			key: fs.readFileSync( packageConfig.certificates.key ),
-		},
-	};
+if ('object' === typeof (packageConfig.certificates)) {
+    server = {
+        type: 'https',
+        options: {
+            cert: fs_1.default.readFileSync(packageConfig.certificates.cert),
+            key: fs_1.default.readFileSync(packageConfig.certificates.key),
+        },
+    };
 }
-
-module.exports = {
-	allowedHosts: 'all',
-	client: {
-		logging: 'warn',
-		overlay: {
-			errors: true,
-			warnings: false,
-		},
-	},
-	headers: {
-		'Access-Control-Allow-Origin': '*',
-		'Access-Control-Allow-Methods': '*',
-		'Access-Control-Allow-Headers': '*',
-	},
-	host: '0.0.0.0', // Allow connections from any IP.
-	hot: true,
-	port: 3000,
-	server,
-	static: false,
+const config = {
+    allowedHosts: 'all',
+    client: {
+        logging: 'warn',
+        overlay: {
+            errors: true,
+            warnings: false,
+        },
+    },
+    headers: {
+        'Access-Control-Allow-Origin': '*',
+        'Access-Control-Allow-Methods': '*',
+        'Access-Control-Allow-Headers': '*',
+    },
+    host: '0.0.0.0', // Allow connections from any IP.
+    hot: true,
+    port: 3000,
+    server,
+    static: false,
 };
+exports.default = config;
+module.exports = config;

package/config/dev-server.config.ts

@@ -0,0 +1,44 @@
+import fs from 'fs';
+import {getPackageConfig} from '../helpers/package-config';
+import type {Configuration} from 'webpack-dev-server';
+
+const packageConfig = getPackageConfig();
+
+const url = new URL( packageConfig.url );
+
+let server: Configuration['server'] = 'https:' === url.protocol ? 'https' : 'http';
+// Load local certificates for https during development.
+if ( 'object' === typeof ( packageConfig.certificates ) ) {
+	server = {
+		type: 'https',
+		options: {
+			cert: fs.readFileSync( packageConfig.certificates.cert ),
+			key: fs.readFileSync( packageConfig.certificates.key ),
+		},
+	};
+}
+
+
+const config: Configuration = {
+	allowedHosts: 'all',
+	client: {
+		logging: 'warn',
+		overlay: {
+			errors: true,
+			warnings: false,
+		},
+	},
+	headers: {
+		'Access-Control-Allow-Origin': '*',
+		'Access-Control-Allow-Methods': '*',
+		'Access-Control-Allow-Headers': '*',
+	},
+	host: '0.0.0.0', // Allow connections from any IP.
+	hot: true,
+	port: 3000,
+	server,
+	static: false,
+}
+
+export default config;
+module.exports = config;

package/config/jest.config.js

@@ -16,6 +16,9 @@ const jestConfig = {
         'is-plain-obj': 'identity-obj-proxy',
         uuid: 'identity-obj-proxy',
     },
+    // Does not support prettier 3 until version 30.
+    // @link https://github.com/jestjs/jest/issues/14305
+    prettierPath: null,
     roots: [
         './tests',
     ],

package/config/jest.config.ts

@@ -21,6 +21,9 @@ const jestConfig: Config = {
 		'is-plain-obj': 'identity-obj-proxy',
 		uuid: 'identity-obj-proxy',
 	},
+	// Does not support prettier 3 until version 30.
+	// @link https://github.com/jestjs/jest/issues/14305
+	prettierPath: null,
 	roots: [
 		'./tests',
 	],

package/config/webpack.dev.js

@@ -1,115 +1,115 @@
-const webpack = require( 'webpack' );
-const ReactRefreshWebpackPlugin = require( '@pmmmwh/react-refresh-webpack-plugin' );
-const path = require( 'path' );
-const ForkTsCheckerWebpackPlugin = require( 'fork-ts-checker-webpack-plugin' );
-const {getPackageConfig} = require( '../helpers/package-config' );
-const {getEntries} = require( '../helpers/entries' );
-const {getConfig, getTsConfigFile, getBrowsersList} = require( '../helpers/config' );
-
-const postcssOptions = getConfig( 'postcss.config' );
-const babelOptions = getConfig( 'babel.config' );
-const cssLoaderOptions = getConfig( 'css-loader.config' );
-const devServerOptions = getConfig( 'dev-server.config' );
-
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const webpack_1 = require("webpack");
+const react_refresh_webpack_plugin_1 = __importDefault(require("@pmmmwh/react-refresh-webpack-plugin"));
+const path_1 = __importDefault(require("path"));
+const fork_ts_checker_webpack_plugin_1 = __importDefault(require("fork-ts-checker-webpack-plugin"));
+const config_1 = require("../helpers/config");
+const entries_1 = require("../helpers/entries");
+const package_config_1 = require("../helpers/package-config");
+const postcssOptions = (0, config_1.getConfig)('postcss.config');
+const babelOptions = (0, config_1.getConfig)('babel.config');
+const cssLoaderOptions = (0, config_1.getConfig)('css-loader.config');
+const devServerOptions = (0, config_1.getConfig)('dev-server.config');
 // To allow line numbers to show up in console errors. @see React Error Boundaries.
-babelOptions.plugins.unshift( '@babel/plugin-transform-react-jsx-source' );
+babelOptions.plugins?.unshift('@babel/plugin-transform-react-jsx-source');
 // To support React Fast Refresh.
-babelOptions.plugins.unshift( 'react-refresh/babel' );
-
+babelOptions.plugins?.unshift('react-refresh/babel');
 const plugins = [
-	new webpack.ProvidePlugin( {
-		jQuery: 'jquery',
-		$: 'jquery',
-	} ),
-	new ReactRefreshWebpackPlugin(),
+    new webpack_1.ProvidePlugin({
+        jQuery: 'jquery',
+        $: 'jquery',
+    }),
+    new react_refresh_webpack_plugin_1.default(),
 ];
-
-// Loads a thread, which verifies any TypeScripts on changes if the
-// project has a "tsconfig.json" file.
-if ( '' !== getTsConfigFile() ) {
-	plugins.push( new ForkTsCheckerWebpackPlugin( {
-		devServer: false,
-		formatter: 'basic',
-		typescript: {
-			configFile: getTsConfigFile(),
-		},
-	} ) );
+// Loads a thread, which verifies any TypeScript on changes if the project has a "tsconfig.json" file.
+if ('' !== (0, config_1.getTsConfigFile)()) {
+    plugins.push(new fork_ts_checker_webpack_plugin_1.default({
+        devServer: false,
+        formatter: 'basic',
+        typescript: {
+            configFile: (0, config_1.getTsConfigFile)(),
+        },
+    }));
 }
-
-module.exports = {
-	devtool: 'eval-source-map',
-	entry: getEntries(),
-	mode: 'development',
-	stats: 'minimal',
-	externals: {
-		jquery: 'jQuery',
-	},
-	target: 'browserslist:' + getBrowsersList().join( ', ' ),
-	output: {
-		path: path.resolve( getPackageConfig().workingDirectory, 'dist' ),
-		filename: '[name].js',
-		publicPath: getPackageConfig().url + ':' + devServerOptions.port + '/js/dist/',
-		chunkFilename: '[name].js',
-	},
-	resolve: {
-		extensions: [ '.ts', '.tsx', '.js', '.jsx', '.json', '.pcss' ],
-		modules: [
-			path.resolve( getPackageConfig().workingDirectory, 'src' ),
-			'node_modules',
-		],
-	},
-	plugins,
-	optimization: {
-		moduleIds: 'named',
-		emitOnErrors: false,
-	},
-	module: {
-		strictExportPresence: true,
-		rules: [
-			{
-				test: /\.[jt]sx?$/,
-				loader: 'babel-loader',
-				include: path.resolve( getPackageConfig().workingDirectory, 'src' ),
-				exclude: /node_modules/,
-				options: babelOptions,
-			},
-			{
-				test: /\.css$/,
-				use: [
-					'style-loader',
-					'css-loader',
-				],
-			},
-			{
-				test: /\.pcss$/,
-				use: [
-					'style-loader',
-					{
-						loader: '@teamsupercell/typings-for-css-modules-loader',
-						options: {
-							banner: '// Autogenerated by typings-for-css-modules-loader.',
-							disableLocalsExport: true,
-							prettierConfigFile: path.resolve( __dirname, '../helpers/.prettierrc.json' ),
-						},
-					},
-					{
-						loader: 'css-loader',
-						options: cssLoaderOptions,
-					},
-					{
-						loader: 'postcss-loader',
-						options: {
-							postcssOptions,
-						},
-					},
-				].filter( loader => {
-					if ( ! getPackageConfig().cssTsFiles ) {
-						return loader.loader !== '@teamsupercell/typings-for-css-modules-loader';
-					}
-					return true;
-				} ),
-			},
-
-		],
-	},
+const config = {
+    devtool: 'eval-source-map',
+    entry: (0, entries_1.getEntries)(),
+    mode: 'development',
+    stats: 'minimal',
+    externals: {
+        jquery: 'jQuery',
+    },
+    target: 'browserslist:' + (0, config_1.getBrowsersList)().join(', '),
+    output: {
+        path: path_1.default.resolve((0, package_config_1.getPackageConfig)().workingDirectory, 'dist'),
+        filename: '[name].js',
+        publicPath: (0, package_config_1.getPackageConfig)().url + ':' + devServerOptions.port + '/js/dist/',
+        chunkFilename: '[name].js',
+    },
+    resolve: {
+        extensions: ['.ts', '.tsx', '.js', '.jsx', '.json', '.pcss'],
+        modules: [
+            path_1.default.resolve((0, package_config_1.getPackageConfig)().workingDirectory, 'src'),
+            'node_modules',
+        ],
+    },
+    plugins,
+    optimization: {
+        moduleIds: 'named',
+        emitOnErrors: false,
+    },
+    module: {
+        strictExportPresence: true,
+        rules: [
+            {
+                test: /\.[jt]sx?$/,
+                loader: 'babel-loader',
+                include: path_1.default.resolve((0, package_config_1.getPackageConfig)().workingDirectory, 'src'),
+                exclude: /node_modules/,
+                options: babelOptions,
+            },
+            {
+                test: /\.css$/,
+                use: [
+                    'style-loader',
+                    'css-loader',
+                ],
+            },
+            {
+                test: /\.pcss$/,
+                use: [
+                    'style-loader',
+                    {
+                        loader: '@teamsupercell/typings-for-css-modules-loader',
+                        options: {
+                            banner: '// Autogenerated by typings-for-css-modules-loader.',
+                            disableLocalsExport: true,
+                            prettierConfigFile: path_1.default.resolve(__dirname, '../helpers/.prettierrc.json'),
+                        },
+                    },
+                    {
+                        loader: 'css-loader',
+                        options: cssLoaderOptions,
+                    },
+                    {
+                        loader: 'postcss-loader',
+                        options: {
+                            postcssOptions,
+                        },
+                    },
+                ].filter(loader => {
+                    if (!(0, package_config_1.getPackageConfig)().cssTsFiles && 'object' === typeof loader) {
+                        return loader.loader !== '@teamsupercell/typings-for-css-modules-loader';
+                    }
+                    return true;
+                }),
+            },
+        ],
+    },
 };
+exports.default = config;
+module.exports = config;

package/config/webpack.dev.ts

@@ -0,0 +1,120 @@
+import {type Configuration as WebpackConfig, ProvidePlugin, WebpackPluginInstance} from 'webpack';
+import ReactRefreshWebpackPlugin from '@pmmmwh/react-refresh-webpack-plugin';
+import path from 'path';
+import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
+
+import {getBrowsersList, getConfig, getTsConfigFile} from '../helpers/config';
+import {getEntries} from '../helpers/entries';
+import {getPackageConfig} from '../helpers/package-config';
+import type {BabelConfig} from './babel.config';
+
+const postcssOptions = getConfig( 'postcss.config' );
+const babelOptions: BabelConfig = getConfig( 'babel.config' );
+const cssLoaderOptions = getConfig( 'css-loader.config' );
+const devServerOptions = getConfig( 'dev-server.config' );
+
+// To allow line numbers to show up in console errors. @see React Error Boundaries.
+babelOptions.plugins?.unshift( '@babel/plugin-transform-react-jsx-source' );
+// To support React Fast Refresh.
+babelOptions.plugins?.unshift( 'react-refresh/babel' );
+
+
+const plugins: WebpackPluginInstance[] = [
+	new ProvidePlugin( {
+		jQuery: 'jquery',
+		$: 'jquery',
+	} ),
+	new ReactRefreshWebpackPlugin(),
+];
+
+// Loads a thread, which verifies any TypeScript on changes if the project has a "tsconfig.json" file.
+if ( '' !== getTsConfigFile() ) {
+	plugins.push( new ForkTsCheckerWebpackPlugin( {
+		devServer: false,
+		formatter: 'basic',
+		typescript: {
+			configFile: getTsConfigFile(),
+		},
+	} ) );
+}
+
+const config: WebpackConfig = {
+	devtool: 'eval-source-map',
+	entry: getEntries(),
+	mode: 'development',
+	stats: 'minimal',
+	externals: {
+		jquery: 'jQuery',
+	},
+	target: 'browserslist:' + getBrowsersList().join( ', ' ),
+	output: {
+		path: path.resolve( getPackageConfig().workingDirectory, 'dist' ),
+		filename: '[name].js',
+		publicPath: getPackageConfig().url + ':' + devServerOptions.port + '/js/dist/',
+		chunkFilename: '[name].js',
+	},
+	resolve: {
+		extensions: [ '.ts', '.tsx', '.js', '.jsx', '.json', '.pcss' ],
+		modules: [
+			path.resolve( getPackageConfig().workingDirectory, 'src' ),
+			'node_modules',
+		],
+	},
+	plugins,
+	optimization: {
+		moduleIds: 'named',
+		emitOnErrors: false,
+	},
+	module: {
+		strictExportPresence: true,
+		rules: [
+			{
+				test: /\.[jt]sx?$/,
+				loader: 'babel-loader',
+				include: path.resolve( getPackageConfig().workingDirectory, 'src' ),
+				exclude: /node_modules/,
+				options: babelOptions,
+			},
+			{
+				test: /\.css$/,
+				use: [
+					'style-loader',
+					'css-loader',
+				],
+			},
+			{
+				test: /\.pcss$/,
+				use: [
+					'style-loader',
+					{
+						loader: '@teamsupercell/typings-for-css-modules-loader',
+						options: {
+							banner: '// Autogenerated by typings-for-css-modules-loader.',
+							disableLocalsExport: true,
+							prettierConfigFile: path.resolve( __dirname, '../helpers/.prettierrc.json' ),
+						},
+					},
+					{
+						loader: 'css-loader',
+						options: cssLoaderOptions,
+					},
+					{
+						loader: 'postcss-loader',
+						options: {
+							postcssOptions,
+						},
+					},
+				].filter( loader => {
+					if ( ! getPackageConfig().cssTsFiles && 'object' === typeof loader ) {
+						return loader.loader !== '@teamsupercell/typings-for-css-modules-loader';
+					}
+					return true;
+				} ),
+			},
+
+		],
+	},
+};
+
+export default config;
+module.exports = config;