유동식 dongsik-yoo

## base.ts
import { render, ComponentChild } from 'preact';
import renderToString from 'preact-render-to-string';

export default abstract class Base {
  private _container: Element;

  private _base?: Element;

  public constructor(container: Element) {
    this._container = container;

## index.ts
import Month from '@src/month';
import Week from '@src/week';

export default {
  Month,
  Week
};
export { Month, Week };

## package.json
{
  "files": [
    "src",
    "dist",
    "index.d.ts"
  ]
}

## package.json
{
  "scripts": {
    "doc": "npm run build:esm && tuidoc",
    "serve": "DEV_SERVER=true webpack-dev-server --mode development",
    "build:dev": "webpack --mode development",
    "build:prod": "NODE_ENV=production webpack --mode production",
    "build:esm": "ttsc -p tsconfig.esm.json",
    "build": "rm -rf dist && npm run build:dev && npm run build:prod && npm run build:esm"
  }
}

## index.html
<head>
  <link href="/dist/esm-ui-library.css" rel="stylesheet">
</head>
<body style="">
  <script type="text/javascript" src="/dist/esm-ui-library.js"></script>
</body>

## webpack.html.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin');
const config = {
  ...,
  resolve: {
    extensions: ['.ts', '.tsx', '.js'], // Add '.js'.
    ...
  },
  plugins: [
    ...,
    new HtmlWebpackPlugin()

## webpack.css.config.js
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const postcssPrefixer = require('postcss-prefixer');
...
const isDevServer = process.env.DEV_SERVER === 'true';
...
module: {
  rules: [
    ...
    {
      test: /\.s[ac]ss$/i,

## postcss.css
.tui-full-calendar-holiday {
  color: red;
  font-size: 15px;
}

## style.css
.holiday {
  color: red;
  font-size: 15px;
}

## prefix.styl
.{css-prefix}holiday {
  color: red;
  font-size: 15px;
}
	import { render, ComponentChild } from 'preact';
	import renderToString from 'preact-render-to-string';

	export default abstract class Base {
	private _container: Element;

	private _base?: Element;

	public constructor(container: Element) {
	this._container = container;
	import Month from '@src/month';
	import Week from '@src/week';

	export default {
	Month,
	Week
	};
	export { Month, Week };
	{
	"scripts": {
	"doc": "npm run build:esm && tuidoc",
	"serve": "DEV_SERVER=true webpack-dev-server --mode development",
	"build:dev": "webpack --mode development",
	"build:prod": "NODE_ENV=production webpack --mode production",
	"build:esm": "ttsc -p tsconfig.esm.json",
	"build": "rm -rf dist && npm run build:dev && npm run build:prod && npm run build:esm"
	}
	}
	<head>
	<link href="/dist/esm-ui-library.css" rel="stylesheet">
	</head>
	<body style="">
	<script type="text/javascript" src="/dist/esm-ui-library.js"></script>
	</body>
	const HtmlWebpackPlugin = require('html-webpack-plugin');
	const config = {
	...,
	resolve: {
	extensions: ['.ts', '.tsx', '.js'], // Add '.js'.
	...
	},
	plugins: [
	...,
	new HtmlWebpackPlugin()
	const MiniCssExtractPlugin = require('mini-css-extract-plugin');
	const postcssPrefixer = require('postcss-prefixer');
	...
	const isDevServer = process.env.DEV_SERVER === 'true';
	...
	module: {
	rules: [
	...
	{
	test: /\.s[ac]ss$/i,