🔥 Flameboard - Vue 3 + TypeScript + Vite

A blazing fast setup to kickstart your development with Vue 3, TypeScript, and Vite!

🚀 Getting Started

This template helps you dive into developing with Vue 3 + TypeScript in Vite. Follow the steps below to get started!

Clone the Repository

git clone https://github.com/lafllamme/flameboard.git
cd flameboard

Install Dependencies

npm install

Start Development Server

npm run dev

Your app should now be running at http://localhost:3000 🎉

🛠 Recommended IDE Setup

For the best experience, use:

• VSCode + Volar for Vue 3 and <script setup> syntax.

  Note: If you're using <script setup>, ensure you have Volar enabled instead of Vetur, as <script setup> is in RFC stage.

💡 Using <script setup>

<script setup> is a syntactic sugar that streamlines component definition in Vue 3. To enable proper IDE support, use Volar and disable Vetur.

🔖 Type Support for .vue Imports in TypeScript

By default, TypeScript shims .vue files as generic Vue components. For full prop type support in .vue files, use the following setup.

If Using Volar

1. Open the VSCode Command Palette.
2. Run Volar: Switch TS Plugin on/off.

If Using Vetur

1. Install @vuedx/typescript-plugin-vue and add it to the plugins section in tsconfig.json.
2. Delete src/shims-vue.d.ts.
3. Open src/main.ts in VSCode.
4. Open the VSCode Command Palette and select "Select TypeScript version" -> "Use workspace version".

🎨 Features

• ⚡ Vite - Super fast, no-bundle dev server
• 🛠 Vue 3 - The latest Vue with composition API
• 🏗 TypeScript - Type-safe development with intellisense and type-checking
• 🔥 Hot Module Replacement (HMR) - Instant updates during development

📂 Project Structure

flameboard/
├── public/              # Static files
├── src/                 # Source code
│   ├── assets/          # Assets like images and styles
│   ├── components/      # Vue components
│   ├── App.vue          # Root component
│   └── main.ts          # Entry point
├── .gitignore           # Git ignore rules
├── package.json         # Project dependencies and scripts
└── vite.config.ts       # Vite configuration

📦 Building for Production

To build the app for production, run:

npm run build

The output will be in the dist/ directory, ready for deployment.

📚 Learn More

• Vue 3 Documentation - Learn more about Vue 3 features.
• Vite Documentation - Explore Vite’s blazing-fast dev server.
• TypeScript Documentation - Discover how TypeScript helps build reliable applications.

🤝 Contributing

Contributions are welcome! Feel free to open an issue or submit a pull request. Please make sure to follow the Code of Conduct.

📄 License

This project is licensed under the MIT License.

---

Made with ❤️ by lafllamme