Cómo cambiar las declaraciones de requerimiento en línea utilizando codemod (jscodeshift)?

29 Jul, 2023 Programación 0

Hola, estoy tratando de escribir un codemod que mueva mi declaración require desde la parte superior del archivo hasta dentro del constructor de la clase.

const moduleA = require('moduleA');
const moduleB = require('../moduleB');

class Example {
  constructor(context) {
    this.lazy(
      "moduleA",
      () => new moduleA(context)
    );
    this.lazy(
      "moduleB",
      () => new moduleB(context)
    );
  }

  lazy() {

  }

  async callThis() {
     this.moduleA.callThatMethod();
  }
}

module.exports = Example;

Estas declaraciones require en la parte superior del archivo están tardando mucho tiempo, y solo se utilizan si se llama a esa API al menos una vez. Dado que require se almacena en caché a nivel de proceso en Node.js de todos modos, estoy tratando de mover la declaración require dentro de la función de flecha.

Como se muestra a continuación:

class Example {
  constructor(context) {
    super(context);
    this.lazy("moduleA", () => { 
       const moduleA = require('moduleA');
       return new moduleA() 
    }
    this.lazy("moduleB", () => {
      const moduleB = require('../moduleB');
      return new moduleB() 
    }
  }

  async callThis() {
     this.moduleA.callThatMethod();
  }
}

Estoy teniendo problemas para lograr esto, porque no sé cómo seleccionar la función “lazy” definida y luego mover el require de la parte superior.

Cualquier ayuda es muy apreciada. Gracias.

davy.ai

July 29, 2023 at 12:53 am

Solución Propuesta

Para lograr el resultado deseado, necesitamos escribir un script de codemod que identifique la función constructor en el archivo dado, encuentre todas las llamadas a la función this.lazy() dentro de ella y mueva la llamada correspondiente a require() dentro de las funciones flecha pasadas como argumento a this.lazy().

Los siguientes pasos describen la solución propuesta:

Usar jscodeshift para analizar el archivo dado y generar una representación AST (Árbol de Sintaxis Abstracta) de su contenido.
Encontrar la declaración de la clase Example en el AST.
Encontrar la declaración de la función constructor dentro de la clase Example.
Encontrar todas las llamadas a la función this.lazy() dentro de la función constructor.
Para cada llamada a this.lazy(), extraer la expresión de la función flecha pasada como segundo argumento.
Buscar dentro del cuerpo de cada función flecha extraída la llamada a require() que debe moverse dentro de ella.
Reemplazar la declaración original de require() en la parte superior del archivo con la nueva que se movió dentro de una función flecha.
Reemplazar la antigua expresión de la función flecha dentro de la llamada this.lazy() con la nueva que incluye la llamada a require().
Usar jscodeshift para aplicar estos cambios al archivo original.

Aquí hay un ejemplo de código que muestra cómo realizar estos pasos usando jscodeshift:

function moveRequireStatements(file, api) {
  const j = api.jscodeshift;
  const ast = j(file.source);

  // Encontrar la declaración de la clase 'Example'.
  const exampleClass = ast.find(j.ClassDeclaration, {
    id: { name: 'Example' },
  });

  // Encontrar la declaración de la función 'constructor' dentro de 'Example'.
  const constructorFn = exampleClass.find(j.ClassMethod, {
    kind: 'constructor',
  });

  constructorFn.forEach((path) => {
    const { node } = path;
    const blockStatement = node.body;

    // Encontrar todas las llamadas a 'this.lazy()' dentro de 'constructor'.
    const calls = j(blockStatement).find(j.CallExpression, {
      callee: {
        type: 'MemberExpression',
        object: { type: 'ThisExpression' },
        property: { name: 'lazy' },
      },
    });

    calls.forEach((call) => {
      // Extraer la expresión de la función flecha pasada como segundo argumento.
      const fn = call.node.arguments[1];
      const block = fn.body;

      // Encontrar la primera declaración de 'require' dentro del cuerpo de la función flecha.
      const requireStatement = j(block).find(j.VariableDeclaration, {
        declarations: [{
          id: { type: 'Identifier' },
          init: {
            type: 'CallExpression',
            callee: { name: 'require' },
          },
        }],
      }).at(0);

      if (requireStatement.size() === 0) {
        // No se encontró una declaración de 'require', pasar a la siguiente llamada a 'this.lazy()'.
        return;
      }

      const requireDecl = requireStatement.get().node.declarations[0];

      // Reemplazar la declaración original de 'require()' en la parte superior del archivo con la nueva.
      const requireName = requireDecl.id.name;
      j(ast)
        .find(j.VariableDeclaration, {
          declarations: [{
            id: { name: requireName },
            init: { type: 'CallExpression' },
          }],
        })
        .at(0)
        .replaceWith(fn.body.body[0]);

      // Reemplazar la antigua expresión de función flecha con la nueva que incluye la llamada a 'require()'.
      call.node.arguments[1] = j.arrowFunctionExpression(
        [],
        j.blockStatement([requireDecl, ...block.body.slice(1)])
      );
    });
  });

  return ast.toSource();
}

Este código se puede guardar en un archivo (por ejemplo, moveRequireStatements.js) y ejecutar usando la herramienta de línea de comandos jscodeshift. Suponiendo que el código original se guarda en un archivo llamado example.js, puedes aplicar la transformación de código de la siguiente manera:

jscodeshift -t moveRequireStatements.js example.js

Esto mostrará el código modificado en la consola. Si deseas guardarlo en un archivo en su lugar, puedes usar la opción -d para especificar el directorio de salida:

jscodeshift -t moveRequireStatements.js example.js -d output/

es.davy.ai

¿Tienes una pregunta?

Cómo cambiar las declaraciones de requerimiento en línea utilizando codemod (jscodeshift)?

Answer

davy.ai

Solución Propuesta