erreur de configuration vue.config.js - peut être confondu avec webpack

introduire

Lors de la configuration de vue.config.js, le message d'erreur « Options non valides dans vue.config.js : 'module' n'est pas autorisé » est signalé, indiquant que la vue.config.jsconfiguration directe moduledes options n'est pas autorisée dans le fichier.

Solution

Dans Vue CLI 3 et supérieur, vue.config.jsil s'agit d'un fichier utilisé pour configurer le projet Vue, mais il permet uniquement la configuration d'options spécifiques, pas toutes les options de configuration de Webpack. Parmi elles, moduleles options appartiennent à la configuration de Webpack et ne doivent pas être placées directement vue.config.jsdans .

Si vous devez configurer des règles Webpack, vous pouvez utiliser configureWebpackl'option permettant d'ajouter une configuration Webpack personnalisée. Voici un exemple :

module.exports = {
    
    
  configureWebpack: {
    
    
    module: {
    
    
      rules: [
        // 在这里添加你的 rules 配置
        {
    
    
          test: /\.js$/,
          exclude: /node_modules/,
          use: {
    
    
            loader: 'babel-loader',
            options: {
    
    
              presets: ['@babel/preset-env'],
            },
          },
        },
        // ...
      ],
    },
  },
};

Dans l'exemple ci-dessus, nous utilisons configureWebpackl'option pour ajouter une configuration Webpack personnalisée qui inclut une .jsrègle de transpilation pour les fichiers.

Veuillez noter que lors de l'utilisation configureWebpackde l'option, la configuration par défaut du Webpack est complètement écrasée, donc d'autres parties de la configuration d'origine doivent être incluses, telles que entry, outputetc. configureWebpackVous pouvez ajouter d'autres options de configuration Webpack selon vos besoins .

Avec les modifications ci-dessus, vous devriez pouvoir ajouter avec succès une configuration de règles Webpack personnalisées au projet Vue.