tengo un muy simple proyecto vue:

<template>
    <div class="text-breakdown">
        <h3 class = "title">Text Breakdown</h3>

        <form onsubmit="greet()">
            <textarea type="text" id = "breakdown-text"
                  placeholder="Enter your text here">
            </textarea>

            <button class = "custom-button dark-button"
                    type="submit">Breakdown</button>
        </form>
    </div>


</template>


<script>
    // eslint-disable-next-line no-unused-vars

   import axios from 'axios';
   // eslint-disable-next-line no-unused-vars
   function greet()  {
       alert("Hello!");
   }
</script>

yo obtengo error 'axios' is defined but never used no-unused-vars error que estoy tratando de deshabilitar. Traté de agregar // eslint-disable-next-line no-unused-vars comentar como he leído en algunas respuestas ayudaría, ¡pero todavía recibo este error!

Eliminar las variables no utilizadas no es una opción, ¡no quiero que aparezca este error en las variables no utilizadas!

EDITAR: Si pongo el comentario exactamente una línea encima de la importación:

<script>
    // eslint-disable-next-line no-unused-vars
   import axios from 'axios';
   // eslint-disable-next-line no-unused-vars
   function greet()  {
       alert("Hello!");
   }
...

Me sale esto en la consola del navegador:

(y localhost nunca se carga, solo pantalla blanca)

EDITAR:

Traté de agregar

"rules": {
   "no-unused-vars": "off"
 }

al fondo de la package.json expediente:

...
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ],
  "rules": {
    "no-unused-vars": "off"
  }
}

y reiniciando el servidor, sin embargo, el error de la imagen de arriba todavía está presente: localhost no se puede cargar. Sin embargo, el error desaparece si elimino la importación por completo.

EDITAR:

Sustitución del script etiqueta con:

<script>
    // eslint-disable-next-line no-unused-vars
    import axios from 'axios';
    export default {
        methods: {
            greet()  {
                alert("Hello!");
            }
        }
    }
</script>

funciona bien. Sin embargo, eliminando la línea de comentario:

<script>
    import axios from 'axios';
    export default {
        methods: {
            greet()  {
                alert("Hello!");
            }
        }
    }
</script>

Da como resultado el error original, a pesar de haber editado el package.json expediente.

Además, ¿por qué tengo que agregar el export default sintaxis al usar el // eslint comenta con el importmientras que solo

<script>
    // eslint-disable-next-line no-unused-vars
    function greet()  {
        alert("Hello!");
    }
</script>

me funciona bien?

RESPUESTA (porque los moderadores no consideraron la solución lo suficientemente importante como para permitir la edición en las respuestas existentes):

Este código debe agregarse dentro de eslintConfig:

"rules": {
      "no-unused-vars": "off"
    }

para que la final eslintConfig parte de package.json Se ve como esto:

  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {
      "no-unused-vars": "off"
    }
  }

Después de editar el paquete.json así y reiniciar el servidor, este código no genera el error:

<script>
    import axios from 'axios';

    export default  {
        methods:  {
            greet()  {
                alert("Hello!");
            }
        }
    }

</script>

Como puede verse, el comentario // eslint… ya no es necesario.

Está utilizando eslint, que agrega reglas a su código, no unused vars es uno de ellos, lo que significa que no se le permite tener una variable sin usar en su código, por lo que importar la variable axios desde import axios from'axios' te da error porque no lo estas usando axios variable todavía. Puede ignorar las reglas al:

1. Deshabilitar una regla en una línea

Puede deshabilitar una regla eslint en una línea agregando // eslint-disable-next-line no-unused-vars encima de la línea que desea deshabilitar, por ejemplo:

// eslint-disable-next-line no-unused-vars
import axios from 'axios';

Pusiste tu comentario en la línea incorrecta, se supone que debe estar arriba import axios from 'axios';así que cambia

// eslint-disable-next-line no-unused-vars

import axios from 'axios';

a

// eslint-disable-next-line no-unused-vars
import axios from 'axios';

2. Deshabilitar una regla por completo en su proyecto

También puede deshabilitar una regla por completo en su proyecto. Para hacer esto necesitas configurar tus reglas de eslint en package.json o .eslintrc.js dependiendo de dónde almacene su configuración de eslint.

Si elige almacenar la configuración de eslint en package.jsonagregar eslintConfig clave como esta:

{
    "name": "your-app-name",
    "dependencies": { ... },
    "devDependencies": { ... },
    "eslintConfig": { // Add this <-----
        "root": true,
        "env": {
            "node": true
        },
        "extends": [
            "plugin:vue/essential",
            "eslint:recommended"
        ],
        "parserOptions": {
            "parser": "babel-eslint"
        },
        "rules": { // rules configuration here <-----
            "no-unused-vars": "off" 
        }
    }
}

Si elige almacenar la configuración de eslint en .eslintrc.jssimplemente agregue rules llave:

module.exports = {
    ...
    rules: {
        "no-unused-vars": "off"
    }
}

• Lea más sobre las reglas disponibles de ESLint: https://eslint.org/docs/rules/
• Lea más sobre la configuración de reglas de ESLint: https://eslint.org/docs/user-guide/configuring#configuring-rules

---

Acerca de su edición, el Cannot set property 'render' of undefined el error se debe a que el componente no se exporta, esto no tiene nada que ver con eslint. Cambiar a:

<script>
// eslint-disable-next-line no-unused-vars
import axios from 'axios';
export default {
   methods: {
      greet()  {
         alert("Hello!");
      }
   }
}
</script>

Cuando está creando un componente Vue, se supone que debe exportarlo, lea más aquí: https://v2.vuejs.org/v2/guide/components.html

Agregue esto en el archivo package.json y reinicie su servidor de desarrollo y la clave de reglas no debe estar dos veces en el archivo package.json.

"rules": {
   "no-unused-vars": "off"
 }

Esa sería una idea bastante buena si ignora solo variables específicas no utilizadas. Por ejemplo. digamos, ignore todas las variables precedidas por _

Aquí sabrás como podrás hacerlo.

rules: {
  'no-unused-vars': ['warn', {
    argsIgnorePattern: '^_',
    varsIgnorePattern: '^_'
  }]
}

Ahora, cualquier variable (es decir, _options) o argumento no utilizado, no creará ningún problema.

Si codifica solo JavaScript, haga lo siguiente:

rules: {
    "no-unused-vars": "off",
  },

Pero si usa TypeScript. Debes agregar algo más.

rules: {
    "no-unused-vars": "off",
    "@typescript-eslint/no-unused-vars": "off",

  }

Intente agregar este archivo a su eslintrc. ¿Tienes uno en tu proyecto?

"rules": {
   "no-unused-vars": "off"
 }

Para deshabilitar completamente las variables no utilizadas, agregue esto a su .eslintrc

    "no-unused-vars": "off",
    "@typescript-eslint/no-unused-vars": "off",

Dado que está utilizando ‘plugin:vue/essential’, la forma de desactivar la regla es agregando 'vue/no-unused-vars': "off" en lugar de 'no-unused-vars': "off" a eslintrc.js