< BACK TO BLOG

NPM @bbon/react-calendar package

πŸ—“οΈ2021-12-14

npm (scoped) npm Build and tag publish NPM

νƒ€μž…μŠ€ν¬λ¦½νŠΈλ‘œ μž‘μ„±λœ λ¦¬μ•‘νŠΈ 달λ ₯ μ»΄ν¬λ„ŒνŠΈμž…λ‹ˆλ‹€.

peer dependencies

μ„€μΉ˜

$ npm install --save @bbon/react-calendar

μ‚¬μš©

import React, { useCallback } from 'react';
import { Calendar } from '@bbon/react-calendar';

import '@bbon/react-calendar/dist/calendar.css';

const MyComponent = () => {

    const handleChangeSelection = useCallback(
        (start?: string, end?: string) => {
            console.info('Selected dates: ', start, end);
        },
        [],
    );

    return (
        <div>
            <Calendar
                useMoveToYear
                useMoveToMonth
                highlightToday
                showDate
                onChange={handleChangeSelection}
            />
        </div>
    );
}

λ Œλ”λ§ κ²°κ³Ό
λ Œλ”λ§ κ²°κ³Ό

λͺ¨μ–‘

@bbon/react-calendar/dist/calendar.css 파일의 λ‚΄μš©μ„ ν™•μΈν•˜κ³ , μŠ€νƒ€μΌμ„ μž¬μ •μ˜ν•΄μ„œ μ‚¬μš©ν•˜μ‹€ 수 μžˆμŠ΅λ‹ˆλ‹€.

μ‹œμ—°

bbon.me: react-calendar 둜 μ΄λ™ν•΄μ„œ λ™μž‘μ„ ν™•μΈν•˜μ‹€ 수 μžˆμŠ΅λ‹ˆλ‹€.

λ²ˆλ“€λŸ¬

Webpack μ—μ„œ Rollup 으둜 λ³€κ²½ν–ˆμŠ΅λ‹ˆλ‹€.

λ³€κ²½μ‚¬μœ λŠ” μ•„λž˜μ™€ κ°™μŠ΅λ‹ˆλ‹€.

  • νŠΈλ¦¬μ‰μ΄ν‚Ή (Tree-shaking) 지원
  • CommonJS λͺ¨λ“ˆκ³Ό ES λͺ¨λ“ˆμ„ λͺ¨λ‘ 제곡

GitHub Repository


Profile picture

Pon Cheol Ku (ꡬ본철)

Software developer

Other sites

If does not find interesting topic, you might visit other site on below link.

Β© 2024, Built with Gatsby