vue.config.js里怎么配置babel-loader vue-loader

在 Vue 项目中，如果需要自定义配置 `babel-loader` 和 `vue-loader`，可以在项目根目录下创建 `vue.config.js` 文件，并添加以下代码：

module.exports = {
  chainWebpack: config => {
    // Babel Loader
    config.module
      .rule('babel')
      .test(/\.js$/)
      .exclude
        .add(/node_modules/)
        .end()
      .use('babel-loader')
        .loader('babel-loader')
        .options({
          presets: ['@babel/preset-env']
        });

    // Vue Loader
    config.module
      .rule('vue')
      .test(/\.vue$/)
      .use('vue-loader')
        .loader('vue-loader')
        .end();
  }
};

上述代码中，`chainWebpack` 方法可以用于在默认的 Webpack 配置上进行修改和扩展。在这里，我们使用 `config.module.rule` 方法分别配置了 `babel-loader` 和 `vue-loader`。

对于 `babel-loader`，我们使用 `test` 方法指定了需要转译的文件类型，使用 `exclude` 方法排除了 `node_modules` 目录下的文件，最后使用 `use` 方法添加了 `babel-loader` 并配置了 `@babel/preset-env` 作为预设。

对于 `vue-loader`，我们同样使用 `test` 方法指定了需要处理的文件类型，并使用 `use` 方法添加了 `vue-loader`。

需要注意的是，以上代码只是示例，具体的配置需根据项目需求进行调整。