Il n'y a pas de fichier d'échange après le package du programme uniapp h5

La dernière version d'uniapp peut rencontrer le problème de l'absence de fichier d'échange lors de l'empaquetage des programmes h5. Cet article analysera la solution pour tout le monde.

Description du problème

Lorsque vous utilisez la dernière version d'uniapp pour empaqueter un programme h5, il y aura une situation où l'empaquetage du programme est terminé, mais aucune page n'est accessible dans le navigateur. Après enquête, il a été constaté que le fichier d'échange requis manquait dans le dossier du programme fourni.

Cause du problème

Après enquête, il a été constaté qu'il y avait un bug dans la dernière version d'uniapp lors de l'empaquetage, ce qui faisait que le fichier d'échange n'était pas inclus dans le Colis une fois l'emballage terminé. Ce bug se produit généralement lors de l'utilisation de la dernière version de vue-router.

Solution

Actuellement, les responsables d'Uniapp n'ont pas fourni de moyen de résoudre ce problème, mais nous pouvons résoudre ce problème par les méthodes suivantes :

#🎜🎜 # 1. Rétrograder la version de vue-router

Étant donné que ce problème se produit généralement dans la dernière version de vue-router, nous pouvons le rétrograder vers une version antérieure. Les étapes spécifiques sont les suivantes :

Exécutez la commande suivante pour rétrograder vue-router : npm install vue-router@x.x.x (x.x.x est le numéro de version correspondant , il est recommandé de choisir la version 3.0.7)
• npm install vue-router@x.x.x（x.x.x为对应版本号，建议选择3.0.7版本）
• 在项目的main.js文件中，将vue-router的引用语句修改为：import VueRouter from 'vue-router/dist/vue-router.common.js'

2. 自定义webpack配置

如果降级vue-router仍未解决问题，我们可以尝试通过自定义webpack配置来修复。

在项目根目录下，创建一个vue.config.js文件，并输入以下代码：

const path = require('path');

module.exports = {
    configureWebpack: {
        plugins: [
            new CopyWebpackPlugin([
                {
                    from: path.resolve(__dirname, './src/pages'),
                    to: path.resolve(__dirname, './dist/pages')
                }
            ])
        ]
    }
}

以上代码中，我们通过CopyWebpackPlugin插件将项目的src/pages目录下的所有文件拷贝至dist/pages目录下，确保打包完成后页面文件夹中包含所有必备文件。

3. 安装legacy-cli

如果以上两种方案均未解决问题，我们可以尝试使用legacy-cli命令行工具。

• 首先安装legacy-cli命令行工具：npm install -g legacy-cli
• 接着执行以下命令打包程序：legacy-cli build --mode developmentDans le fichier main.js du projet, modifiez l'instruction de référence de vue-router en : importer VueRouter depuis 'vue-router/dist/vue-router.common.js'

2 Configuration du webpack personnalisé

#🎜🎜. #Si vous rétrogradez vue -router ne résout toujours pas le problème, nous pouvons essayer de le résoudre par une configuration Webpack personnalisée.

Dans le répertoire racine du projet, créez un fichier vue.config.js et saisissez le code suivant :

rrreee

Dans le code ci-dessus, nous pass Le plug-in CopyWebpackPlugin copie tous les fichiers du répertoire src/pages du projet dans le répertoire dist/pages. Assurez-vous que les pages sont. dans le dossier une fois l'emballage terminé. Contient tous les documents requis. #🎜🎜##🎜🎜#3. Installez Legacy-cli#🎜🎜##🎜🎜#Si les deux solutions ci-dessus ne résolvent pas le problème, nous pouvons essayer d'utiliser la commande legacy-cli outil de ligne. #🎜🎜##🎜🎜##🎜🎜#Installez d'abord l'outil de ligne de commande legacy-cli : npm install -g Legacy-cli#🎜🎜##🎜🎜 # Exécutez ensuite la commande suivante pour empaqueter le programme : legacy-cli build --mode development#🎜🎜##🎜🎜##🎜🎜#Après les étapes ci-dessus, nous pouvons nous assurer que le programme empaqueté Le dossier contient tous les fichiers d'échange requis. #🎜🎜##🎜🎜#Conclusion#🎜🎜##🎜🎜#Ce qui précède est la solution au problème selon lequel il n'y a pas de fichier d'échange après l'empaquetage du programme uniapp h5. Bien que ce problème puisse nous dérouter et nous ennuyer, en quelques étapes simples, nous pouvons résoudre ce problème et assurer le fonctionnement normal du programme. #🎜🎜#

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!