From 1794b3c68a8ba450ca2029cb5f53ac2523d3de87 Mon Sep 17 00:00:00 2001 From: Harrison Ifeanyichukwu Date: Fri, 28 Jun 2024 08:46:20 +0200 Subject: [PATCH] feat: simplify output formats for dist builds --- README.md | 65 +++++++++++++++++++++++------- src/@types/index.d.ts | 89 ++++++------------------------------------ src/config.ts | 28 +++++++------ src/ex/helper.ts | 84 +++++++++++++++++++++++++++++++++++++++ src/modules/Bundler.ts | 19 ++++----- 5 files changed, 170 insertions(+), 115 deletions(-) create mode 100644 src/ex/helper.ts diff --git a/README.md b/README.md index 5643d6f..5bf0a72 100644 --- a/README.md +++ b/README.md @@ -18,10 +18,12 @@ Library developers face the problem of shipping modern Javascript codes to forma Moreso, there is need to generate typescript definition files for most projects (javascript and typescript projects alike), sourcemaps, minification, production build, development build, resolution of dynamic imports, etc. -library source codes in one parsing, allowing you to generate commonjs, es module, and browser builds at once. It is very configurable and runs asynchronously. +This library allows you to generate commonjs, es module, and browser builds at once with sourcemaps and typescript definition files. It is very configurable. This package automates the whole process with the right configurations and makes it easy to get all target build formats generated in one command with configurability in mind. +it generates typescript definition files for what is built, by leveraging typescript build api. + ### Installation with npm ```bash @@ -72,7 +74,7 @@ The following build formats are supported: It is possible to configure the build process via a config file or via cli options. To configure the build via a config file, create a `rollup.config.js` file in the project's root directory ```javascript -const { createConfig } = require('./temp'); +const { createConfig } = require('@teclone/rollup-all'); module.exports = createConfig({ defaults: { src: './src', @@ -96,11 +98,6 @@ module.exports = createConfig({ */ sourcemap: true, - /** - * minify, only applies to iife and umd builds - */ - minify: true, - /** * applies to umd and iife builds */ @@ -115,11 +112,6 @@ module.exports = createConfig({ include: [], plugins: [], - - /** - * build envs, only applies to iife and umd builds - */ - envs: ['production', 'development'], }, /** @@ -142,9 +134,17 @@ module.exports = createConfig({ * iife build config, disabled by default */ iife: { - enabled: false, + enabled: true, out: './build/iife', - src: 'src/ex', + src: './src', + + // defines outputs + outputs: [ + ['development', 'minified'], + ['production', 'minified'], + ], + + minifiedSuffix: 'min', }, /** @@ -153,6 +153,14 @@ module.exports = createConfig({ umd: { enabled: false, out: './build/umd', + src: './src', + + // defines outputs + outputs: [ + ['development', 'minified'], + ['production', 'minified'], + ], + minifiedSuffix: 'min', }, }); ``` @@ -180,4 +188,31 @@ if (process.env.NODE_ENV === 'development') { } ``` -This is taken care of automatically with the help of [babel-plugin-transform-inline-environment-variables](https://babeljs.io/docs/babel-plugin-transform-inline-environment-variables) +This configuration is achieved using the output option as shown below + +```typescript +const { createConfig } = require('@teclone/rollup-all'); +module.exports = createConfig({ + /** + * umd build config, disabled by default + */ + umd: { + enabled: false, + out: './build/umd', + src: './src', + + // defines outputs + outputs: [ + ['development', 'minified'], + ['production', 'minified'], + ['uni', 'minified'], + + ['development', 'unminified'], + ['production', 'unminified'], + ['uni', 'unminified'], + ], + + minifiedSuffix: 'min', + }, +}); +``` diff --git a/src/@types/index.d.ts b/src/@types/index.d.ts index 21c9171..3d3706d 100644 --- a/src/@types/index.d.ts +++ b/src/@types/index.d.ts @@ -42,12 +42,6 @@ export interface FormatConfig { */ sourcemap?: true | false | 'inline'; - /** - * indicates if minified build should be generated, - * applies only to the iife and umd builds - */ - minify?: boolean; - /** * babel presets */ @@ -71,9 +65,18 @@ export interface FormatConfig { plugins?: Plugin[]; /** - * applies to iife and umd builds + * applies to distribution builds only + * for iife and umd, two builds will be generated per file per environment, + * first file is the non minified, the second is the minified version */ - envs?: BuildEnvironment[]; + outputs?: Array<[BuildEnvironment, 'minified' | 'unminified']>; + + /** + * suffix to be added to minified outputs for iife and umd builds + * + * if set to false, there will be no suffix added + */ + minifiedSuffix?: string | false; } export type Config = Partial<{ @@ -85,76 +88,6 @@ export type Config = Partial<{ silent?: boolean; }; -type old = { - /** - * if true, output logs are not logged - */ - silent?: boolean; - - /** - * defaults to project package name pascal-cased - */ - moduleName?: string; - - /** - * allowed file extensions. defaults to .js, .ts, .jsx, .tsx - */ - extensions?: string[]; - - /** - * extensions of files to copy over as assets - */ - assetExtensions?: string[]; - - /** - * defines file patterns to process for all builds - */ - include?: (string | RegExp)[]; - - /** - * defines specific string of file patterns to exclude for all builds. - * excluded files are treated as assets - */ - exclude?: (string | RegExp)[]; - - /** - * boolean indicating if the interop rollup setting should be enabled for all builds - */ - interop?: boolean; - - /** - * boolean indicating if sourcemap should be generated for all builds, - * can be true, false, or 'inline', defaults to true - */ - sourcemap?: true | false | 'inline'; - - /** - * indicates if minified build should be generated, - * applies to dist builds only - */ - minify?: boolean; - - /** - * rollup watch config - */ - watch?: object; - - /** - * applies to dist builds - */ - envs?: BuildEnvironment[]; - - /** - * babel presets - */ - babelPresets?: any[]; - - /** - * babel plugins - */ - babelPlugins?: any[]; -}; - export interface Module { // id for indexing this file id: number; diff --git a/src/config.ts b/src/config.ts index 5c3baca..a8b782c 100644 --- a/src/config.ts +++ b/src/config.ts @@ -23,11 +23,6 @@ export const config: Config = { */ sourcemap: true, - /** - * minify, only applies to iife and umd builds - */ - minify: true, - /** * applies to umd and iife builds */ @@ -42,11 +37,6 @@ export const config: Config = { include: [], plugins: [], - - /** - * build envs, only applies to iife and umd builds - */ - envs: ['production', 'development'], }, /** @@ -71,7 +61,15 @@ export const config: Config = { iife: { enabled: false, out: './build/iife', - src: 'src/ex', + src: './src', + + // defines outputs + outputs: [ + ['development', 'minified'], + ['production', 'minified'], + ], + + minifiedSuffix: 'min', }, /** @@ -80,5 +78,13 @@ export const config: Config = { umd: { enabled: false, out: './build/umd', + src: './src', + + // defines outputs + outputs: [ + ['development', 'minified'], + ['production', 'minified'], + ], + minifiedSuffix: 'min', }, }; diff --git a/src/ex/helper.ts b/src/ex/helper.ts new file mode 100644 index 0000000..2debeae --- /dev/null +++ b/src/ex/helper.ts @@ -0,0 +1,84 @@ +import { Config } from '../@types'; + +export const config: Config = { + defaults: { + src: './src', + + out: './build', + + entryFile: './index', + + /** + * allowed file extensions + */ + extensions: ['.js', '.ts', '.jsx', '.tsx'], + + /** + * boolean indicating if the interop rollup setting should be enabled + */ + interop: true, + + /** + * boolean indicating if sourcemap should be generated, can be true, false, or 'inline' + */ + sourcemap: true, + + /** + * minify, only applies to iife and umd builds + */ + minify: true, + + /** + * applies to umd and iife builds + */ + globals: {}, + + babelPlugins: [], + + babelPresets: [], + + exclude: [], + + include: [], + + plugins: [], + + /** + * build envs, only applies to iife and umd builds + */ + envs: ['production', 'development'], + }, + + /** + * cjs build config + */ + cjs: { + enabled: true, + out: './build/cjs', + }, + + /** + * es build config + */ + es: { + enabled: true, + out: './build/es', + }, + + /** + * iife build config, disabled by default + */ + iife: { + enabled: false, + out: './build/iife', + src: 'src/ex', + }, + + /** + * umd build config, disabled by default + */ + umd: { + enabled: false, + out: './build/umd', + }, +}; diff --git a/src/modules/Bundler.ts b/src/modules/Bundler.ts index e6ddcf1..a3678eb 100644 --- a/src/modules/Bundler.ts +++ b/src/modules/Bundler.ts @@ -274,7 +274,12 @@ class Bundler { const newRelativePath = path.join( fileModule.locationRelativeToSrc, - [fileModule.baseName, envPrefix, minify ? 'min' : '', 'js'] + [ + fileModule.baseName, + envPrefix, + minify && config.minifiedSuffix ? config.minifiedSuffix : '', + 'js', + ] .filter(Boolean) .join('.') ); @@ -420,21 +425,13 @@ class Bundler { return; } - await forEach(formatConfig.envs || [], async (env) => { + await forEach(formatConfig.outputs || [], async ([env, minifyOption]) => { process.env.NODE_ENV = env; await this.buildFiles(buildFiles, formatConfig, { format, env, - minify: false, + minify: minifyOption === 'minified', }); - - if (formatConfig.minify) { - await this.buildFiles(buildFiles, formatConfig, { - format, - env, - minify: true, - }); - } }); }); }