Comment résoudre le problème que Vue ne s'exécute pas et modifier le fichier de configuration

Avec le développement continu de la technologie de développement front-end, le framework Vue est devenu un outil très important. Lors du développement à l'aide du framework Vue, la modification des fichiers de configuration est une opération très courante. Cependant, il est très courant de modifier le fichier de configuration sans l'exécuter. Alors, comment résoudre ce problème ? Cet article vous présentera comment résoudre le problème de Vue qui n'exécute pas les fichiers de configuration modifiés.

Tout d'abord, il doit être clair qu'il existe deux fichiers de configuration pour le framework Vue, l'un est le fichier de configuration par défaut de Vue, vue.config.js, et l'autre est le fichier de configuration webpack.config.js de Webpack. Lors du développement, nous devons modifier ces deux fichiers de configuration pour répondre à des besoins différents. Cependant, parfois nous modifions ces deux fichiers de configuration mais constatons que le framework Vue n'exécute pas ces modifications.

Pour le fichier de configuration par défaut de Vue vue.config.js, une situation courante consiste à modifier la couleur du thème de la bibliothèque tierce (telle que ElementUI, AntDesign, etc.) référencée par le fichier. À ce stade, nous devons ajouter le code suivant à vue.config.js :

module.exports = {
  css: {
    loaderOptions: {
      less: {
        modifyVars: {
          'primary-color': '#1DA57A'
        },
        javascriptEnabled: true
      }
    }
  }
}

Cependant, lorsque nous avons enregistré les modifications et réexécuté le projet Vue, nous avons constaté que la couleur du thème n'avait pas été modifiée. En effet, le fichier de configuration par défaut de Vue ne sera analysé et appliqué que lors de l'exécution de la commande Vue-cli-service. Si nous modifions le fichier de configuration sans réexécuter la commande, le framework Vue ne lira pas nos modifications.

La solution à ce problème est très simple, ajoutez simplement l'option --config à la commande. Par exemple, si nous voulons modifier la couleur du thème, nous devons exécuter la commande suivante :

vue-cli-service serve --config vue.config.js

De cette façon, le framework Vue peut lire nos modifications.

Il existe également des problèmes similaires pour le fichier de configuration Webpack webpack.config.js. Par exemple, si nous souhaitons modifier le chemin du fichier d'entrée de Webpack, ajoutez le code suivant à webpack.config.js :

module.exports = {
  entry: './src/index.js'
}

De même, lorsque nous avons réexécuté le projet Vue après avoir enregistré les modifications, nous avons constaté que Webpack ne l'avait pas fait. lisez nos modifications de configuration. En effet, Webpack ne lira par défaut que le fichier de configuration nommé webpack.config.js. Si nous voulons que Webpack lise d'autres fichiers, nous devons ajouter l'option --config à la commande, par exemple :

vue-cli-service serve --config myWebpackConfig.js

De cette façon. , Webpack Nous pourrons lire nos modifications.

Pour résumer, si nous constatons que le framework Vue n'exécute pas ces modifications lors de la modification du fichier de configuration Vue, nous devons faire attention aux points suivants :

1. Après avoir modifié le fichier de configuration, assurez-vous de réexécuter le commande correspondante pour que Vue puisse la lire Nos modifications.
2. Pour le fichier de configuration par défaut de Vue, vous devez ajouter l'option --config à la commande afin que Vue puisse lire le fichier de configuration que nous spécifions.
3. Pour le fichier de configuration Webpack, vous devez également ajouter l'option --config à la commande.

J'espère que le contenu ci-dessus pourra vous aider à résoudre le problème de Vue qui ne s'exécute pas pour modifier le fichier de configuration, vous permettant ainsi de développer le framework Vue plus facilement.

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!