Vitersim

Simplify Your Vite React Project Setup
Vitersim is a lightweight CLI tool that automates the cleanup and simplification of a new Vite React project. By deleting unnecessary files, clearing up the index.css, and rewriting App.jsx or App.tsx to a minimal component, Vitersim allows developers to start with a clean, streamlined environment.
Features
- Automated Cleanup: Deletes
App.css, the assets folder, and clears index.css.
- Streamlined Structure: Rewrites
App.jsx or App.tsx to a minimal "Hello World" component.
- Instant CLI Execution: Run directly with
npx vitersim—no manual setup required.
- Improves Project Readiness: Helps developers get right to coding without manual file adjustments.
Installation and Usage
You can use Vitersim without installing it globally by using npx:
npx vitersim
Or install it locally within your project:
npm install vitersim --save-dev
Then, add a script in your package.json to run Vitersim:
"scripts": {
"clean": "vitersim"
}
Run the script with:
npm run clean
How It Works
Vitersim performs the following actions in a Vite React project:
- Deletes
app.css: Removes any default styles.
- Deletes the
assets folder: Clears unnecessary assets.
- Rewrites
App.jsx or App.tsx: Updates the component to a simple "Hello World" starter.
- Clears
index.css: Empties the main stylesheet to start fresh.
Project Requirements
Ensure your project has the following structure for Vitersim to function properly:
project-root/
├── src/
│ ├── App.jsx (or App.tsx)
│ ├── app.css
│ ├── assets/
│ └── index.css
└── ...
Example Output
After running vitersim, your App.jsx (or App.tsx) will be reset to:
import React from 'react';
function App() {
return (
<div>
Hello World!
</div>
);
}
export default App;
Technical Details
Vitersim uses Node.js's fs and path modules to interact with the file system. It follows an asynchronous, modular approach to ensure non-blocking operations and robust error handling.
Compatibility
| Node.js | >= 14.0.0 |
| Vite | 3.x and above |
| React | 17.x and above |
Troubleshooting
If you encounter issues, check that:
- The file and folder names match (
app.css, assets, App.jsx or App.tsx, and index.css).
- You have sufficient file permissions in your project directory.
For additional help, please open an issue on GitHub.
Contributing
We welcome contributions to enhance Vitersim! To contribute:
- Fork the repository.
- Create a new branch for your feature or bug fix.
- Submit a pull request with a detailed explanation of changes.
License
This project is licensed under the MIT License. See the LICENSE file for details.
Acknowledgments
Vitersim was developed by Selvin PaulRaj K. We appreciate community feedback and contributions to make Vitersim better for all users.
Connect with Us