Vue Templates Logo Vue Templates
Vue H5 Template screenshot

Vue H5 Template

Author Avatar Theme by Sunniejs
Updated: 20 Feb 2025
3361 Stars

:tada:vue搭建移动端开发,基于vue-cli4.0+webpack 4+vant ui + sass+ rem适配方案+axios封装，构建手机端模板脚手架

Github Live Preview

Categories

Vite Scss

Overview

The vue-h5-template is a mobile template scaffolding based on Vue3, Vite, one of the UI libraries (nutui, varlet, or vant), Sass, viewport adaptation solution, and axios encapsulation. If you are not familiar with Vue3 and would like to continue using Vue2 for development, you can check out the vue2-h5-template for detailed documentation. The project offers a way for developers to easily create mobile applications using the mentioned technologies.

Features

  • Vue3: Built on the latest version of Vue.js, providing all the benefits and features of Vue3.
  • Vite: Utilizes the Vite build tool to offer fast and efficient development and bundling.
  • UI Libraries: Provides options to choose one of the UI libraries (nutui, varlet, or vant) for UI components.
  • Sass: Supports the use of Sass, a powerful CSS preprocessor, to enhance styling capabilities.
  • Viewport Adaptation: Includes a viewport adaptation solution, ensuring that the application layout adapts well to different screen sizes.
  • Axios Encapsulation: Offers an encapsulated version of axios, a popular HTTP client library, for easy API communication.
  • Mobile Template: Specifically designed for mobile application development.

Installation

To install and use the vue-h5-template, follow these steps:

  1. Clone the repository:

    git clone [repository-url]

  2. Navigate to the project directory:

    cd vue-h5-template

  3. Install dependencies:

    npm install

  4. Choose the UI library (nutui, varlet, or vant) by commenting/uncommenting the relevant lines in the main.js file.

  5. Start the development server:

    npm run dev

Summary

The vue-h5-template is a feature-rich mobile template scaffolding that combines Vue3, Vite, one of the UI libraries (nutui, varlet, or vant), Sass, viewport adaptation solution, and axios encapsulation. It provides an easy way for developers to create mobile applications using the latest technologies and offers flexibility to choose the desired UI library. The installation process is straightforward, making it convenient for developers to get started with the template.