Vue Templates Logo Vue Templates
Vuetify Swipeout screenshot

Vuetify Swipeout

Author Avatar Theme by Davidgaroro
Updated: 5 Nov 2021
145 Stars

A swipe out example built with Vue 2 + Vuetify + Swiper.

Github Live Preview

Categories

Vuetify

Overview:

The vuetify-swipeout project is a swipe out example developed using Vue, Vuetify, and Swiper. It incorporates several features for efficient web development, including Vue CLI 3 integration, hot-reload during development, lint-on-save with ESLint, Stylus CSS preprocessor, and more. The project also excels in performance, achieving a 100/100 Lighthouse score and offering features like a Progressive Web App, app manifest, and service worker implementation.

Features:

  • Vue CLI 3 Integration: Utilizes Vue CLI 3 along with Webpack and vue-loader for single file Vue components.
  • Hot-reload in Development: Provides hot-reload functionality during development for seamless editing.
  • Lint-on-save with ESLint: Includes ESLint with Standard configuration for code-linting on save.
  • Stylus CSS Preprocessor: Integrates Stylus CSS preprocessor for styling customization.
  • Vuetify a-la-carte: Allows for the inclusion of specific components from Vuetify, reducing project size in production.
  • Progressive Web App Support: Offers Progressive Web App features, app manifest, and service worker integration.
  • Workbox Options: Includes options for Workbox to cache Google Fonts for enhanced performance.

Installation:

To install the vuetify-swipeout project, follow these steps:

  1. Clone the repository:
    git clone [repository-url]
  2. Install dependencies:
    npm install
  3. For development environment:
    npm run serve
  4. For production build:
    npm run build
  5. To run ESLint for code linting:
    npm run lint

Summary:

The vuetify-swipeout project is a feature-rich example built using Vue, Vuetify, and Swiper. It offers a seamless development experience with its integration of Vue CLI 3, hot-reload functionality, and ESLint for code quality. With additional features like Progressive Web App support, 100/100 Lighthouse score, and advanced Workbox options, vuetify-swipeout proves to be a robust and performance-optimized solution for web development.