web-dev-qa-db-fra.com

Vue CLI construire et exécuter le fichier index.html sans serveur

J'utilise la dernière vue-cliversion 3. .

Mon problème actuel est que chaque fois que je lance npm run build les fichiers générés dans le dossier dist ne peuvent pas être exécutés sans serveur.

J'aimerais pouvoir simplement ouvrir le fichier index.html sur le navigateur. Comment dois-je procéder?

vue.jsvuejs2vue-cli
10
Gene Parcellano

J'ai pu résoudre ce problème en modifiant manuellement le url des fichiers référencés.

C'est un peu pénible, mais c'était une solution sans avoir à jouer avec la configuration de construction.

Qu'as tu besoin de faire:

  1. Ouvert index.html
  2. Trouver href=/ et remplacez par href=
  3. Trouver src=/ et remplacez par src=

REMARQUE: j'avais besoin de cette solution parce que je créais une application Phonegap.

6
Gene Parcellano

J'ai rencontré un problème similaire et les deux changements suivants m'ont aidé à le faire fonctionner. Maintenant, je peux simplement ouvrir index.html dans Chrome en tant que fichier pour exécuter mon SPA à partir du système de fichiers .

  1. Dans vue.config.js , je n'avais pas de publicPath configuré, ce qui entraînait la valeur par défaut "/".
    J'ai dû le configurer pour vider une chaîne comme celle-ci afin qu'il utilise des chemins relatifs:

    module.exports = {
    publicPath: '',
}

    PS: Depuis Vue CLI 3.3 utilisez publicPath au lieu du désormais obsolète baseURL

  2. J'utilisais le mode history de vue-router, qui ne fonctionne pas sur un système de fichiers local pour rediriger les chemins vers index.html. J'ai donc omis le mode pour revenir au mode par défaut hash.

9
Syed Andaleeb Roomy

Vous pouvez utiliser le module http-server

npm install http-server -g
http-server dist/

normalement, le serveur démarre au port 8080 afin que vous puissiez servir l'application de génération sur http: // localhost: 808

3
thopaw