Angular 12中判断日期是否为工作日（含公共假期）及date-holidays包导入报错问题求助

Hey there! Let's tackle your problem with date-holidays first, then dive into some reliable alternatives that play nice with Angular 12 (no Moment.js required).

Why You're Seeing Errors with date-holidays #

The error about missing @babel/runtime/helpers/esm/slicedToArray points to a compatibility gap between Angular 12's build chain (which uses Webpack 5 by default) and the dependencies of date-holidays.

Specifically:

• date-holidays relies on astronomia, a package that uses older Babel syntax and isn't pre-compiled for modern ES module environments like Angular 12.
• Angular 12's default setup doesn't automatically transpile third-party dependencies that haven't been properly packaged for ES modules, leading to missing module errors.

While you could try patching this by:

• Installing the missing @babel/runtime package
• Adding date-holidays and astronomia to Angular's allowedCommonJsDependencies in angular.json
• Configuring extra Babel transpilation rules for these packages

This can quickly turn into a dependency conflict rabbit hole. For a straightforward feature like holiday checking, it's usually not worth the hassle.

Recommended Alternatives #

Here are three solid options that work seamlessly with Angular 12:

1. date-fns (Most Recommended) #

date-fns is a modular, tree-shakable date library perfect for Angular. You'll maintain your own list of Czech public holidays (easy to update yearly) and use date-fns utilities to check weekends and holidays.

Step 1: Install

npm install date-fns

Step 2: Create a Utility Function

import { isWeekend, isSameDay, parseISO } from 'date-fns';

// Update this list yearly with Czech public holidays
const CZECH_PUBLIC_HOLIDAYS = [
  '2024-01-01', // New Year's Day
  '2024-01-02', // Day after New Year's
  '2024-04-08', // Good Friday
  '2024-04-10', // Easter Monday
  '2024-05-01', // Labour Day
  '2024-05-08', // Liberation Day
  '2024-07-05', // St. Cyril and Methodius Day
  '2024-07-06', // Jan Hus Day
  '2024-09-28', // St. Wenceslas Day
  '2024-10-28', // Independent Czechoslovak State Day
  '2024-11-17', // Struggle for Freedom and Democracy Day
  '2024-12-24', // Christmas Eve
  '2024-12-25', // Christmas Day
  '2024-12-26', // St. Stephen's Day
];

export function isWorkDay(date: Date): boolean {
  // First check if it's a weekend
  if (isWeekend(date)) return false;
  
  // Then check if it's a public holiday
  return !CZECH_PUBLIC_HOLIDAYS.some(holidayStr => 
    isSameDay(date, parseISO(holidayStr))
  );
}

2. luxon #

Developed by the Moment.js team, luxon is a modern, immutable date library that's Angular-friendly. The approach mirrors date-fns: maintain your holiday list and use Luxon's methods to validate dates.

Step 1: Install

npm install luxon

Step 2: Utility Function Example

import { DateTime } from 'luxon';

const CZECH_PUBLIC_HOLIDAYS = [
  '2024-01-01',
  // ... same list as above
];

export function isWorkDay(date: Date): boolean {
  const luxonDate = DateTime.fromJSDate(date);
  
  // Check weekend (Luxon uses 1 = Monday, 7 = Sunday)
  if (luxonDate.weekday === 6 || luxonDate.weekday === 7) return false;
  
  // Check public holidays
  const dateStr = luxonDate.toISODate();
  return !CZECH_PUBLIC_HOLIDAYS.includes(dateStr);
}

3. @nesto-software/date-holidays-core #

If you still want automatic holiday calculations (instead of maintaining your own list), try the core version of date-holidays. It strips out heavy dependencies like astronomia (the source of your original error) while retaining core holiday lookup functionality.

Install & Usage

npm install @nesto-software/date-holidays-core

import { HolidaysCore } from '@nesto-software/date-holidays-core';

const hd = new HolidaysCore('CZ');
const today = new Date();

// Check if today is a holiday
const isHoliday = hd.isHoliday(today);
// Check if today is a weekend
const isWeekend = today.getDay() === 0 || today.getDay() === 6;

const isWorkDay = !isHoliday && !isWeekend;

This version has a smaller footprint and is far more likely to work with Angular 12's build system without extra configuration.

内容的提问来源于stack exchange，提问作者emka26