@litpack/create-litpack v0.0.1
Frontend Boilerplate with Rspack, Lit.js, Babel, TypeScript, and TailwindCSS
This is a frontend boilerplate project set up using Rspack, Lit.js, TypeScript, TailwindCSS, Preact Signals, and Babel, designed to help you quickly start your development process while maintaining modern build optimizations.
Table of Contents
Features
- Modern JavaScript and TypeScript support with Babel
- Reactive state management using Preact Signals
- Hot Module Replacement (HMR) for efficient development
- CSS processing with TailwindCSS and PostCSS
- Optimized asset handling using Rspack
- Compression of assets for production
- Source maps for easier debugging in development
Getting Started
To get started with this boilerplate, clone the repository and install the dependencies:
git clone <repository-url>
cd <repository-name>
npm installPrerequisites
Make sure you have Node.js installed on your machine.
Scripts
This project comes with several scripts to help you with your development and build processes:
Clean the build directory:
npm run cleanBuild for production:
npm run buildStart the development server:
npm run start
Project Structure
<repository-name>
├── dist/ # Compiled and built files
├── src/ # Source files
│ ├── app.ts # Main entry point
│ └── index.html # HTML template
├── package.json # Project configuration
└── rspack.config.js # Rspack configurationDevelopment
To start a development server with Hot Module Replacement, run:
npm run startThe development server will be available at http://localhost:9000, and changes to your files will automatically reflect in the browser.
Production Build
To create a production build with optimizations, run:
npm run buildThis will generate optimized files in the dist directory, ready for deployment.
License
This project is licensed under the MIT License. See the LICENSE file for details.
### Customization1 year ago