vue eslint

// Vue 文件中的 ESLint 配置示例

<template>
  <div id="app">
    <h1>Hello World</h1>
  </div>
</template>

<script>
export default {
  name: 'App',
  data() {
    return {
      message: 'Hello Vue!'
    };
  },
  methods: {
    greet() {
      console.log(this.message);
    }
  }
};
</script>

<style scoped>
#app {
  color: red;
}
</style>

/* .eslintrc.js 配置文件示例 */
module.exports = {
  root: true,
  env: {
    node: true
  },
  extends: [
    'plugin:vue/essential',
    '@vue/standard'
  ],
  rules: {
    // 自定义规则，例如：
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
  },
  parserOptions: {
    parser: 'babel-eslint'
  }
};

// 解释说明：
// 1. 在 Vue 文件中，ESLint 可以帮助我们检查代码规范，避免常见的错误。
// 2. .eslintrc.js 文件是 ESLint 的配置文件，用于定义代码的规则和风格。
// 3. `extends` 字段指定了继承的预设规则集，这里使用了 Vue 的基本规则和标准风格。
// 4. `rules` 字段可以自定义特定的规则，例如在生产环境中禁用 console 和 debugger。
// 5. `parserOptions` 指定了解析器选项，这里使用了 Babel 解析器。