Comment déployer le projet Vue sur Gitee

En tant que framework JavaScript populaire, les fonctionnalités de Vue telles que la composantisation, les composants basés sur les données et les fichiers uniques ont reçu une attention et une reconnaissance généralisées. Gitee (code cloud) est une communauté open source qui intègre l'hébergement de code, la gestion de projet, le développement collaboratif, le déploiement et les fonctions en ligne. Cet article explique comment déployer des projets Vue sur des pages Gitee.

1. Préparation

1.1 Créez un compte Gitee

Tout d'abord, vous devez vous rendre sur la page d'accueil de Gitee ([https://gitee.com/)](https://gitee.com/) pour vous inscrire et vous connecter dans.

1.2 Créer un projet Vue

Ensuite, vous devez créer un projet Vue. Ici, nous prenons Vue CLI comme exemple. Si vous utilisez d'autres méthodes pour créer le projet, veuillez ignorer cette étape.

vue create my-project

Pendant le processus de création, vous pouvez choisir d'utiliser les paramètres par défaut de Vue ou de le configurer manuellement. Si vous souhaitez apprendre à configurer manuellement un projet Vue, veuillez vous référer à la documentation officielle de Vue.

1.3 Initialiser le référentiel Git et pousser le code

Une fois le projet Vue créé, nous devons le placer dans un référentiel Git et le pousser vers le référentiel distant. Nous supposons que vous avez installé Git et que vous avez une certaine expérience de son utilisation.

cd my-project
git init
git add .
git commit -m "initial commit"
git remote add origin [your-gitee-repository]
git push -u origin master

2. Déployez le projet Vue sur Gitee Pages

2.1 Créer un référentiel Gitee Pages

Gitee Pages est un service d'hébergement de sites Web statiques qui peut déployer des fichiers statiques dans le référentiel Gitee Pages afin qu'il soit accessible via des URL d'accès public. .

Sélectionnez "Nouvel entrepôt", entrez le nom de l'entrepôt, cochez "Initialiser le fichier README.md" et "Créer des pages Gitee", et enfin cliquez sur "Créer un entrepôt".

2.2 Configurer le référentiel Gitee Pages

Après la création, vous devez sélectionner « Paramètres » > « Pages Gitee », puis sélectionner « Source : branche gh-pages /répertoire docs » dans « Pages Gitee Pages ».

2.3 Installer l'outil de déploiement

Gitee Pages fournit officiellement un outil de déploiement - Client de déploiement automatique de Gitee Pages Nous devons le télécharger et l'installer afin de déployer le projet sur Gitee Pages.

Vous pouvez retrouver la "Fonction client de déploiement automatique" dans la page Gitee Pages, télécharger et installer le client de déploiement automatisé en fonction de votre système d'exploitation.

2.4 Configurer le déploiement automatisé

Après avoir téléchargé et installé le client de déploiement automatique, vous devez créer un fichier de configuration de déploiement dans le répertoire racine du projet.

touch gitee-pages.yml

Ensuite, vous devez ouvrir le fichier avec un éditeur de texte et modifier le contenu suivant :

pages:
  branch: master
  html_dir: dist
  cname: your.gitee.pages.domain.com
  sync:
    items:
     - dist

Où branch représente la branche utilisée par Gitee Pages, html_dir représente le nom du répertoire que vous souhaitez déployer et cname représente votre personnalisation Nom de domaine, sync.items représente le répertoire de déploiement, ici c'est dist.

2.5 Déployer le projet Vue

Après avoir terminé le travail ci-dessus, vous pouvez essayer d'utiliser le client de déploiement automatique pour déployer le projet Vue sur les pages Gitee.

gitee-pages push

Après cela, vous pouvez accéder à votre projet Vue dans la page de configuration de Gitee Pages et à votre nom de domaine personnalisé.

3. Résumé

Dans cet article, nous avons présenté comment déployer des projets Vue sur des pages Gitee. Avec des opérations simples, vous pouvez déployer rapidement votre projet Vue sur une URL d'accès public afin que davantage de personnes puissent accéder à votre application Vue. Si vous souhaitez en savoir plus sur Vue et Gitee Pages, vous pouvez vous référer à la documentation officielle et aux ressources communautaires pour explorer davantage de méthodes et de technologies de développement.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!