https://github.com/ahansson/hgrid-css-vue-vite
Vue 3 demo project with hgrid-css and vite
https://github.com/ahansson/hgrid-css-vue-vite
hgrid-css vite vue
Last synced: about 1 month ago
JSON representation
Vue 3 demo project with hgrid-css and vite
- Host: GitHub
- URL: https://github.com/ahansson/hgrid-css-vue-vite
- Owner: ahansson
- Created: 2021-09-08T23:01:23.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2023-03-06T10:28:44.000Z (about 2 years ago)
- Last Synced: 2025-02-12T17:51:58.642Z (3 months ago)
- Topics: hgrid-css, vite, vue
- Language: Vue
- Homepage:
- Size: 362 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Integrating [hgrid-css](https://github.com/ahansson/hgrid-css) in a Vue 3 project with Vite
## Hgrid Documentation
https://hgrid.io/documentation/integrate/#vue
## Repository
https://github.com/ahansson/hgrid-css-vue-vite
Minimal setup of Vue with Sass compilation for `hgrid-css`.
## What is hgrid-css ?
A lightweight and practical CSS utility kit with zero config and a flat learning curve.
Repo: https://github.com/ahansson/hgrid-css
## Installation
Installs the required `node_modules`, including `hgrid-css`.
```bash
npm install
```
## Development
Starts the development server with Sass compilation for **hgrid** and serves your site from the `public` folder on localhost:3000 (if available).
```bash
npm run dev
```
## Build
```bash
npm run build
```
Also check the (general) tips on [reducing the output size](https://hgrid.io/documentation/production/) of your CSS.
## Template Setup
The template uses Vue 3 `` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
## Recommended IDE Setup
- [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)