In this article, we review a tool called Father. I pulled this below information from the Father repository README.md. Although, their README is in Chinese, I will be submitting a PR with a docs translation in the near future.

I found a file named .fatherrc.ts in a package named zustand-utils. This zustand-utils is used in Lobechat source code.

The below code is picked from .fatherrc.ts

import { defineConfig } from 'father';
 
export default defineConfig({
  esm: { output: 'es' },
  cjs: { output: 'lib', platform: 'browser' },
});

defineConfig is imported from ‘father’. This is even when I had to search for “father” npm package.

What is “Father” package?

Father is an NPM package development tool that helps developers efficiently and reliably develop NPM packages, generate build artifacts, and publish them. It offers the following key features:

• Dual-mode Build: Supports both Bundless and Bundle build modes — ESModule and CommonJS outputs use Bundless mode, while UMD outputs use Bundle mode.

• Multiple Build Engines: Bundle mode uses Webpack as the build engine, while Bundless mode supports esbuild, Babel, and SWC, allowing flexible configuration switching.

• Type Generation: Supports generating .d.ts type definitions for TypeScript modules, whether for source code builds or dependency pre-bundling.

• Persistent Caching: All output types support persistent caching, enabling faster incremental builds.

• Project Inspection: Checks for common pitfalls in NPM package development to ensure more stable releases.

• Micro Generators: Adds commonly used engineering capabilities to projects, such as setting up Jest for testing.

• Dependency Pre-Bundling: Provides out-of-the-box dependency pre-bundling to improve the stability of Node.js frameworks/libraries and prevent issues caused by upstream dependency updates (experimental).

Quick start guide

Use create-father to quickly create a new Father project:

npx create-father my-father-project

This template includes only the basic configuration. For additional configuration options, refer to the Configuration documentation.

To build the project, run:

npx father build

After the build completes, check the dist folder to see the generated output.

Configuration

You could create a file named .fatherrc.ts and set up your configuration. Read more about father configuration.

config.md is in Chinese language, I have submitted a PR with English translations.

import { defineConfig } from 'father';
 
export default defineConfig({
  esm: { output: 'es' },
  cjs: { output: 'lib', platform: 'browser' },
});

This above code snippet is picked from zustand-utils/.fatherrc.ts

output is used to specify the prebundle output directory. platform is used to specify the target platform for the build output.

About me:

Hey, my name is Ramu Narasinga. I study large open-source projects and create content about their codebase architecture and best practices, sharing it through articles, videos.

I am open to work on interesting projects. Send me an email at ramu.narasinga@gmail.com

My Github — https://github.com/ramu-narasinga

My website — https://ramunarasinga.com

My Youtube channel — https://www.youtube.com/@thinkthroo

Learning platform — https://thinkthroo.com

Codebase Architecture — https://app.thinkthroo.com/architecture

Best practices — https://app.thinkthroo.com/best-practices

Production-grade projects — https://app.thinkthroo.com/production-grade-projects

References:

1. https://www.npmjs.com/package/zustand-utils

2. https://github.com/arvinxx/zustand-utils

3. https://github.com/arvinxx/zustand-utils/blob/master/.fatherrc.ts

4. https://github.com/umijs/father

5. https://www.npmjs.com/package/zustand-utils

6. https://github.com/lobehub/lobe-chat/blob/446db7a203dc81082aac8ac0a4a6a604453eb7c0/src/store/serverConfig/store.ts#L2