sirve - EsLint-Suprimir "No usar ''nuevo'' para efectos secundarios"

eslint vscode

Question

Vi la forma de suprimir esto con jsLint, lo probé, no funcionó.

Necesito la palabra clave ''nueva'' o mi script no funciona.

¿Cómo puedo suprimirlo en .eslintrc?

Muchas gracias

Actualización: por petición de Jordan. [Tenga en cuenta que mi aplicación está escrita en ReactJs]

 // 3rd party 
 const AnimateSlideShow = require(''../js-animation'');

 export default class Animate extends React.Component {

   .......

    fetchJsAnimation() {
      const animation = this.refs.Animation;
      new AnimateSlideShow(animation);
    }
   ......
  }

Error: no use ''nuevo'' para efectos secundarios no-nuevos

Ahora, si cumplo con EsLint, mi aplicación cs out:

No se detectó (en promesa) TypeError: No se puede establecer la propiedad ''_handleMouse'' de undefined (...)

Answer 1

Aquí está la documentación para la regla de ESLint en cuestión: http://eslint.org/docs/rules/no-new.html

No permitir new efectos secundarios ( no-new )

El objetivo de usar new con un constructor es, por lo general, crear un objeto de un tipo en particular y almacenar ese objeto en una variable, como:

var person = new Person();

Es menos común usar new y no almacenar el resultado, como:

new Person();

En este caso, el objeto creado se desecha porque su referencia no se almacena en ningún lugar, y en muchos casos, esto significa que el constructor debe reemplazarse con una función que no requiera utilizar una nueva.

Lo pegué arriba porque creo que es importante entender cuál es la intención de la regla y no solo cómo hacerlo desaparecer.

Si no puede encontrar una manera de deshacerse de lo new , puede suprimir este error con la directiva eslint-disable :

fetchJsAnimation() {
  /* eslint-disable no-new */
  const animation = this.refs.Animation;
  new AnimateSlideShow(animation);
}

Las directivas ESLint tienen un ámbito de bloque, por lo que se suprimirán solo dentro de esta función. También puede suprimir reglas en una sola línea con la eslint-disable-line :

new AnimateSlideShow(animation); // eslint-disable-line no-new

Si realmente necesita deshabilitar esta regla para todo su proyecto, en la .eslintrc de "rules" su .eslintrc establezca el valor de esta regla en 0 :

{
  // ...
  "rules": {
    "no-new": 0,
    // ...
  }
}

También puede hacer que sea una advertencia en lugar de un error configurándolo en 1 ( 2 es error).

Answer 2

Extendiéndose en la respuesta de , aquí hay una versión ES5 (esencialmente un IIFE con una declaración de devolución):

(function (Vue) {
  ''use strict'';

  return new Vue({
    el: ''.unity-header-wrapper''
  });
}(Vue));

Estamos evitando el error var de ESLint no utilizado, que aparece si se usa de esta manera:

var myApp = new Vue({
  el: ''.unity-header-wrapper''
});

También estamos evitando el uso de la instanciación ''new Vue ()'' independiente (que evita errores de efectos secundarios en ESLint)

var myApp = new Vue({
  el: ''.unity-header-wrapper''
});

También puede agregar Vue como global en la configuración de ESLint, para evitar un error de var global no definido, como se ve aquí: Variables globales en Javascript y ESLint

// .eslintrc.json
"globals": {
  "Vue": true
}

Answer 3

Trate de cubrir su función en una función anónima

(()=>code)();

en tu ejemplo

fetchJsAnimation() {
  const animation = this.refs.Animation;
  (()=>new AnimateSlideShow(animation))();
}

O puede usar este patrón, por ejemplo, el marco javascript moderno, por ejemplo. vuejs vue Aquí hay un ejemplo

(() => new Vue({ 
    el: ''#app'', 
    router, 
    store, 
    components: { App }, 
    template: ''<App/>'' 
}))();