Pandell Frontend Configuration Packages

Shared configuration packages for frontend tools used by Pandell engineering teams.

• packages/browserslist-config
  Configuration for browserslist: Share target browsers between different front-end tools, like Autoprefixer, Stylelint and babel-preset-env.

• packages/eslint-config
  Configuration for eslint: Find and fix problems in your JavaScript code and typescript-eslint: The toolings that enables ESLint and Prettier to support TypeScript

• packages/jest-config
  Pandell-defined reusable mocks and helpers for jest: Delightful JavaScript testing framework with a focus on simplicity.

• packages/postcss-config
  Configuration for postcss: A tool for transforming CSS with JavaScript.

• packages/prettier-config
  Configuration for prettier: An opinionated code formatter.

• packages/stylelint-config
  Configuration for stylelint: A mighty CSS linter that helps you avoid errors and enforce conventions.

• packages/typescript-config
  Configuration for typescript: A strongly typed programming language that builds on JavaScript, giving you better tooling at any scale.

• packages/webpack-config Legacy: not recommended for new projects.
  Configuration for webpack: At its core, webpack is a static module bundler for modern JavaScript applications.

Development

Development tools

• nodejs v24+, scoop install nodejs-lts on Windows.
• pnpm v12+, scoop install pnpm on Windows.
• git v2+, scoop install git on Windows.
• Optional, recommended on Windows:
  • Windows Terminal, the latest version.
  • PowerShell, the latest cross-platform version.
  • VSCode, the latest version with all the recommended extensions (see .vscode/extensions.json).
    • WallabyJS extension requires an enterprise license. If you have not been assigned a license yet, please contact itgroup@pandell.com.

How to initialize development environment

cd ~/work
git clone https://github.com/pandell/frontend-config.git
cd frontend-config

# initialize node dependencies
pnpm install --frozen-lockfile --prefer-offline

# check formatting, build, and lint all packages
pnpm verify

NPM registry tag management

When publishing a pre-release, we typically label it with a custom tag. It is a good idea to remove this tag once the pre-release is over.

Use npm dist-tag subcommands to manage registry tags:

# list specified package's tags in the registry
npm dist-tag ls @pandell/jest-config

# tag the specified package version in the registry
npm dist-tag add @pandell/jest-config@4.2.0-preview.1 preview

# remove specified tag from the registry
npm dist-tag rm @pandell/jest-config preview