eslint config for laravel-mix with vue

.eslintrc.js

const OFF = 'off';
const WARN = 'warn';
const ERROR = 'error';
const MAX_COMPLEXITY = 11;

module.exports = {
  root: true,
  env: {
    node: true,
  },
  extends: [
    'eslint:recommended',
    'plugin:vue/recommended',
    'airbnb-base',
    'plugin:@intlify/vue-i18n/recommended',
  ],
  settings: {
    'import/resolver': {
      // too tricky. Need to resolve async webpack config from mix
      // webpack: {
      // config: 'node_modules/laravel-mix/setup/webpack.config.js',
      // },
      alias: [
        ['@', './resources/js'],
      ],
    },
    'vue-i18n': {
      localeDir: 'resources/lang/*.json',
    },
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? ERROR : OFF,
    'no-debugger': process.env.NODE_ENV === 'production' ? ERROR : OFF,

    // import
    'import/no-commonjs': ERROR,
    'import/no-extraneous-dependencies': ERROR,
    'import/extensions': [
      ERROR,
      'always',
      {
        js: 'never',
      },
    ],

    // airbnb-base
    complexity: [WARN, MAX_COMPLEXITY],
    'no-eq-null': ERROR,
    'no-magic-numbers': [ERROR, {
      ignore: [0, -1, 1, 100],
      ignoreArrayIndexes: true,
      enforceConst: true,
      detectObjects: false,
    }],
    'no-param-reassign': [ERROR, {
      props: true,
      ignorePropertyModificationsFor: [
        'state', // for mutation vuex
        'e', // for e.return value
      ],
    }],

    // vue
    'vue/max-attributes-per-line': ['error', {
      singleline: 3,
      multiline: 3,
    }],
    'vue/attributes-order': ERROR,
    'vue/singleline-html-element-content-newline': ERROR,
  },
  parserOptions: {
    ecmaVersion: 2020,
  },
  overrides: [
    {
      files: ['*.config.*', 'webpack.*', '.eslintrc.js'],
      rules: {
        'import/no-commonjs': OFF,
        'global-require': OFF,
        'import/no-extraneous-dependencies': OFF,
      },
    },
  ],
};

install.bash

npm i eslint eslint-config-airbnb-base eslint-import-resolver-alias eslint-plugin-import eslint-plugin-vue @intlify/eslint-plugin-vue-i18n