https://github.com/mttankkeo/typescript-preact-webpack

This is template that is simple start-kit about Preact with Typescript.
https://github.com/mttankkeo/typescript-preact-webpack

lightweight preact spa startkit template terser typescript webpack

Last synced: 6 days ago
JSON representation

This is template that is simple start-kit about Preact with Typescript.

• Host: GitHub
• URL: https://github.com/mttankkeo/typescript-preact-webpack
• Owner: MTtankkeo
• License: mit
• Created: 2024-08-14T05:16:19.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-09-15T08:14:20.000Z (about 2 months ago)
• Last Synced: 2024-10-16T11:25:33.454Z (21 days ago)
• Topics: lightweight, preact, spa, startkit, template, terser, typescript, webpack
• Language: JavaScript
• Homepage:
• Size: 834 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README-kr.md
  • License: LICENSE

Awesome Lists containing this project

README

        


  

  
Preact with Typescript

  이 템플릿은 Preact에서 Typescript 환경을 설정하는 시작 키트입니다.






> __현지화 문서 참조__


> [English (Origin)](https://github.com/MTtankkeo/typescript-preact-webpack)

# 기본 구성

1. Webpack `Bundler`

2. Webpack Dev Server `for hot reload`

3. Preact

4. [Wouter](https://www.npmjs.com/package/wouter)

5. Typescript

6. Javascript minimizer `Used by terser`

7. CSS minimizer `Used by 'css-minimizer-webpack-plugin'`

8. CSS loader

9. SVG loader `Used by preact-svg-loader`

# NPM 빌드

원활한 개발 환경이 조성되려면 `npm run build`를 반복적으로 입력하지 않고 클라이언트 측의 변경사항이 발생한다면 이를 자동으로 감지하여 빌드될 수 있도록 합니다.

> 최상위 경로부터 시작하여 `./` 에서 아래 명령어를 터미널에 입력하세요.

```cli

npm run dev

```

| 유형 | 설명 |

| ---- | ----------- |

| build | 높은 사용자 경험을 위해 최적화와 압축 과정을 거친 이후 프로덕션 모드로서 빌드됩니다.

| build:dev | 최대한 빠르게 빌드되어야 하므로 최적화와 압축 과정이 생략되고 개발 모드로서 빌드됩니다.

| watch | 최대한 빠르게 빌드되어야 하므로 최적화와 압축 과정이 생략되고 프로덕션 모드로서 빌드됩니다, 또한 변경 사항이 발생하면 자동으로 재빌드됩니다.

| watch:dev | 최대한 빠르게 빌드되어야 하므로 최적화와 압축 과정이 생략되고 개발 모드로서 빌드됩니다, 또한 변경 사항이 발생하면 자동으로 재빌드됩니다.

| dev | 최대한 빠르게 빌드되어야 하므로 최적화와 압축 과정이 생략되고 빌드되며 캐싱됩니다,또한 변경 사항이 발생하면 해당 내용만 다시 재빌드되며 실시간으로 웹사이트에 변경사항이 업데이트됩니다.