Le projet vue est emballé dans un fichier exe

Pour empaqueter un projet Vue sous forme de programme installable (.exe), nous pouvons utiliser le framework Electron. Electron vous permet de créer des applications de bureau multiplateformes à l'aide de technologies Web telles que Vue, HTML et CSS.

1. Téléchargez le modèle de démarrage rapide électronique

adresse de téléchargement de l'entrepôt git

git clone https://github.com/electron/electron-quick-start 
cd electron-quick-start
npm install
npm start

Insérer la description de l'image ici
安装成功显示
Insérer la description de l'image ici
Une erreur peut être signalée lors de l'installation des dépendances.

先清一下缓存:npm cache clean --force
设置一下镜像源:npm config set registry https://registry.npm.taobao.org
原来没有设置过的,设置镜像地址:npm config set disturl https://npm.taobao.org/dist
设置electron镜像:npm config set electron_mirror https://npm.taobao.org/mirrors/electron/

Insérer la description de l'image ici
Définir le miroir électronique : npm config set electronic_mirror https://npm.taobao.org/mirrors/electron/ Si l'erreur est signalée et ne peut pas être ajoutée, recherchez directement le fichier .npmrc, ouvrez-le et
collez-le dedans

electron_mirror=https://npm.taobao.org/mirrors/electron/

2. Modifiez la configuration du fichier vue à empaqueter et emballez-le

Recherchez le fichier de configuration vue.config.js

//	vue.config.js
module.exports = {
    
       
	publicPath: "./",   
} 

Dans certains cas, la page de configuration du routage doit être modifiée (j'ai modifié le fichier vue.config.js et accédé directement à la page dist/index.html après l'avoir empaqueté, qui était vide, et les fichiers css et js n'ont pas indiqué le chemin les erreurs)
Insérer la description de l'image ici

Ensuite, emballez le projet vue dans un fichier dist

3. Configurez le démarrage rapide d'électrons

Supprimez le fichier index.html dans le répertoire racine d'électron-quick-start et
placez le fichier dist emballé par le projet vue dans le fichier electronic-quick-start.
Insérer la description de l'image ici

Installez la dépendance electr-packager requise pour l'empaquetage dans le cadre du projet electronic-quick-start

npm install electron-packager --save-dev

Modifiez la configuration du fichier main.js sous le projet electronic-quick-start.
Insérer la description de l'image ici
Il existe plusieurs propriétés ici pour configurer la taille de la fenêtre du fichier exe, ainsi que pour désactiver le bouton de fermeture et s'il faut supprimer la bordure de la fenêtre.
Insérer la description de l'image ici

Ne vous inquiétez pas, il reste encore une étape. Entrez package.json et ajoutez la directive packager dans le script

![Insérer la description de l'image ici](https://img-blog.csdnimg.cn/3638f3d3a91c4fba9b9e4fee3241dafb.png

Enfin un paquet avec des instructions
Insérer la description de l'image ici

Le fichier exe que nous voulons
Insérer la description de l'image ici

Je suppose que tu aimes

Origine blog.csdn.net/to_prototy/article/details/132429439
conseillé
Classement