Como resolver APIs do Node.js por meio de polyfills

Através da Azion CLI, você pode inicializar uma aplicação baseada em templates ou vincular um projeto existente. A lista de web frameworks inclui Next.js, React, Vue, Angular, Astro, JavaScript e outros. Esses frameworks JavaScript são executados no edge da Azion, em cima do Azion Runtime.

Os projetos com esses frameworks geralmente fazem uso de APIs de Node.js. Através do processo de build da Azion, realizado pelo Vulcan, essas APIs são resolvidas através do uso de polyfills.

Este guia mostrará como usar a API Buffer do Node.js através de polyfills em um projeto JavaScript na Azion usando a Azion CLI e o Vulcan.

Pré-requisitos

Antes de começar, você deve ter:

• Uma conta na plataforma da Azion com o módulo Edge Functions habilitado.
• A versão mais recente da Azion CLI instalada.
• Um editor de código.
• Acesso ao terminal.
• Node.js ≥ 18 instalado.

Inicialize um projeto JavaScript

1. No terminal, inicialize o projeto:

azion init

2. Digite o nome polyfills-guide:

Your application's name:  (glorious-curiosity) polyfills-guide

3. Escolha o template de JavaScript:

Getting templates available? Choose a template for your project: (Use arrow keys)
 >Javascript
  Angular
  Astro
  Hexo
  Next
  React
  Vue
  Vite

4. Digite y para iniciar um servidor de desenvolvimento local.

5. Digite y para instalar as dependências do projeto.

6. Escolha um gerenciador de pacotes.

7. Acesse a porta que foi retornada no terminal. Exemplo:

[Vulcan] [Server] › ✔  success   Function running on port 0.0.0.0:3000, url: http://localhost:3000

8. Retorne ao terminal e encerre o processo.

9. Acesse seu projeto:

cd polyfills-guide

10. Crie o arquivo vulcan.config.js e cole as seguintes propriedades:

module.exports = {
  entry: 'main.js',
  builder: 'webpack',
  useNodePolyfills: true,
};

11. Após aplicar estas configurações, você pode importar as APIs necessárias para o seu projeto. Neste exemplo, estamos usando a API Buffer do Node.js:

Dentro do arquivo main.js:

// Importe a classe Buffer do módulo 'buffer' no Node.js
import { Buffer } from 'node:buffer';

// Defina uma função chamada 'myWorker' que pega um evento como argumento
export default function myWorker(event) {
  // Crie uma nova instância de Buffer 'buf1' a partir da string "x"
  var buf1 = Buffer.from("x");
  // Crie uma nova instância de Buffer 'buf2' a partir da string "x"
  var buf2 = Buffer.from("x");
  // Compare 'buf1' e 'buf2' usando o método Buffer.compare,
  // que retorna um número indicando a igualdade dos buffers
  var a = Buffer.compare(buf1, buf2);

  // O resultado será 0, pois ambos os buffers são iguais
  console.log(a);

  // Agora, vamos trocar os valores de 'buf1' e 'buf2'
  buf1 = Buffer.from("y");
  buf2 = Buffer.from("x");
  // Compare 'buf1' e 'buf2' novamente
  a = Buffer.compare(buf1, buf2);

  // Aqui, o resultado será 1
  console.log(a);

  // A função retorna um novo objeto Response com a string "Testando buffer polyfills"
  return new Response("Testando polyfills");
}

12. Execute o projeto localmente rodando:

azion dev

Agora você pode verificar os logs no terminal e ver a API Buffer funcionando através de polyfills.