Comment modifier l'adresse du serveur dans le packaging vue

Alors que les développeurs continuent d'optimiser et de mener des recherches approfondies sur les frameworks front-end, lorsque nous utilisons Vue pour le développement de projets, nous devons souvent empaqueter le code et le publier sur le serveur. Dans ce processus, une chose qui doit être payée. L'attention à laquelle il faut faire attention est : la modification de l'adresse du serveur.

Prérequis

Avant de commencer à présenter les étapes spécifiques du packaging de Vue et à modifier l'adresse du serveur, nous devons comprendre les prérequis suivants :

1 Déjà installé Vue et comprendre comment l'utiliser

2. pour empaqueter le code et publier sur le serveur

3. Comprendre les connaissances de base du déploiement front-end

Étape 1 : ouvrez le fichier config.js

Tout d'abord, nous devons trouver le fichier config.js dans le projet vue. se trouve dans le répertoire racine du projet. Dans ce fichier, nous allons configurer les paramètres de packaging de Vue.

Étape 2 : Modifier les variables d'environnement de production

Dans le fichier config.js, nous pouvons trouver les variables d'environnement de production sous build. Ces variables sont utilisées lors de la compilation du webpack et peuvent empaqueter le code que nous avons écrit dans un fichier.

Vous devez rechercher la variable env en cours de production et la modifier comme suit :

env: require('./prod.env'),

Ensuite, continuez à rechercher la variable assetsPublicPath en production et remplacez-la par l'adresse de votre serveur, par exemple :

assetsPublicPath: 'https://example.com/'

Où, exemple .com doit être remplacé par votre propre adresse de serveur afin que Webpack publie vos fichiers au bon endroit.

Étape 3 : Reconditionner le code et le publier sur le serveur

Ensuite, nous devons utiliser les commandes fournies par Vue pour reconditionner le code et le publier sur le serveur.

Dans le répertoire racine de votre projet, utilisez la commande suivante pour empaqueter :

npm run build

Cette commande exécutera webpack pour compiler et empaqueter tout votre code source dans un ensemble de fichiers statiques. Ces fichiers seront placés dans un répertoire appelé dist.

Ensuite, vous devez télécharger tous les fichiers et dossiers du répertoire dist au bon emplacement sur le serveur et vous assurer que vous avez spécifié la bonne adresse du serveur lors de la modification des variables d'environnement de production.

Conclusion

Dans cet article, nous avons appris à empaqueter et à publier le code du projet Vue sur le serveur, et à modifier les variables d'environnement de production dans le projet Vue pour s'adapter aux différents environnements de serveur. J'espère que cet article pourra vous aider à mieux utiliser Vue pour le développement et le déploiement de projets.

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!