Suporte a env, mudanças de api e novidades do Deno 1.38
Tags: deno, typescript, development
Published: 2024-01-13 20:30:57

---
title: Suporte a env, mudanças de api e novidades do Deno 1.38
published: true
date: 2024-01-03 11:00:52 UTC
tags: deno,typescript,development
canonical_url: https://blog.lsantos.dev/deno-1-38/
cover_image: https://raw.githubusercontent.com/khaosdoctor/blog-assets/master/images/2023/12/articles.png
---
Em Novembro o runtime de TypeScript mais amado de todos ganhou mais uma versão! E, como é de costume, vamos cobrir aqui o que a gente pode esperar de novo nessa versão 1.38 do Deno!

## Doc com HTML

O Deno possui um comando muito interessante chamado `deno doc`, que faz basicamente o que você espera, gera uma documentação do módulo que você está lendo.

Até o momento tínhamos algumas opções como gerar a documentação em JSON, ou então gerar apenas a documentação privada do módulo, mas isso não era muito útil especialmente porque a maioria delas era apenas uma forma de printar essa mesma documentação no terminal.

Agora, a versão 1.38 inclui uma opção `--html`, que permite que você gere páginas completas de documentação para seu módulo mesmo que ele não esteja publicado no `deno.land`.

É só rodar:

```
deno doc --html --name "Meu módulo" ./mod.ts
```

Que vai gerar uma série de arquivos de documentação em HTML que você pode publicar. E você pode fazer isso para QUALQUER módulo e qualquer arquivo do seu projeto.

Esse é o vídeo criado pela equipe do Deno que mostra como isso pode ser feito.

<iframe width="200" height="113" src="https://www.youtube.com/embed/hQ2wEIUGV-M?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen title='The new and improved "deno doc" command with HTML output'></iframe>

Além disso, a nova opção `--lint` faz com que o Deno analise seu código em busca de problemas que possam prejudicar a documentação!

## Hot Module Reload

Uma das funcionalidades mais interessantes do Deno é poder utilizar o excelente `--watch` quando estamos executando um código para poder recarregar a nossa aplicação em caso de algum tipo de mudança.

O problema é que, muitas vezes, esse restart da aplicação não acontece da maneira esperada, interrompendo processos no meio da execução, por isso agora temos uma melhoria com a opção `--unstable-html`.

HMR (ou Hot Module Reload) é uma técnica muito utilizada em desenvolvimento (principalmente para frontend) para poder substituir o conteúdo de um arquivo sem precisar reiniciar todo o processo, mantendo estado, memória e tudo que vem junto.

Esse vídeo do time do Deno mostra bem como essa funcionalidade ajuda no desenvolvimento:

<video src="https://blog.lsantos.dev/content/media/2023/12/deno-hmr.mp4" poster="https://img.spacergif.org/v1/1440x626/0a/spacer.png" width="1440" height="626" playsinline preload="metadata" style="background: transparent url('https://blog.lsantos.dev/content/media/2023/12/deno-hmr_thumb.jpg') 50% 50% / cover no-repeat;"></video>
<button>
                        <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24">
                            <path d="M23.14 10.608 2.253.164A1.559 1.559 0 0 0 0 1.557v20.887a1.558 1.558 0 0 0 2.253 1.392L23.14 13.393a1.557 1.557 0 0 0 0-2.785Z"></path>
                        </svg>
                    </button>

<button>
                            <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24">
                                <path d="M23.14 10.608 2.253.164A1.559 1.559 0 0 0 0 1.557v20.887a1.558 1.558 0 0 0 2.253 1.392L23.14 13.393a1.557 1.557 0 0 0 0-2.785Z"></path>
                            </svg>
                        </button><button>
                            <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24">
                                <rect x="3" y="1" width="7" height="22" rx="1.5" ry="1.5"></rect>
                                <rect x="14" y="1" width="7" height="22" rx="1.5" ry="1.5"></rect>
                            </svg>
                        </button>0:00
 /0:23
<input type="range" max="100" value="0"><button>1×</button><button>
                            <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24">
                                <path d="M15.189 2.021a9.728 9.728 0 0 0-7.924 4.85.249.249 0 0 1-.221.133H5.25a3 3 0 0 0-3 3v2a3 3 0 0 0 3 3h1.794a.249.249 0 0 1 .221.133 9.73 9.73 0 0 0 7.924 4.85h.06a1 1 0 0 0 1-1V3.02a1 1 0 0 0-1.06-.998Z"></path>
                            </svg>
                        </button><button>
                            <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24">
                                <path d="M16.177 4.3a.248.248 0 0 0 .073-.176v-1.1a1 1 0 0 0-1.061-1 9.728 9.728 0 0 0-7.924 4.85.249.249 0 0 1-.221.133H5.25a3 3 0 0 0-3 3v2a3 3 0 0 0 3 3h.114a.251.251 0 0 0 .177-.073ZM23.707 1.706A1 1 0 0 0 22.293.292l-22 22a1 1 0 0 0 0 1.414l.009.009a1 1 0 0 0 1.405-.009l6.63-6.631A.251.251 0 0 1 8.515 17a.245.245 0 0 1 .177.075 10.081 10.081 0 0 0 6.5 2.92 1 1 0 0 0 1.061-1V9.266a.247.247 0 0 1 .073-.176Z"></path>
                            </svg>
                        </button><input type="range" max="100" value="100">

Perceba que, à medida que o número do incremento é alterado, a aplicação já pega o resultado e começa a aplicar a nova mudança sem precisar reiniciar a aplicação inteira.

Você também pode passar arquivos específicos para essa flag com:

```
deno run --unstable-hmr=data.ts ./mod.ts
```

E você também pode ouvir os eventos de atualização do HMR usando um event listener:

```
addEventListener('hmr', (e) => {
  console.log(e.detail.path)
})
```

## Suporte a .env

Como [o Node já fez antes](https://blog.lsantos.dev/dotenv-nodejs/), agora é a vez do Deno ter suporte nativo a arquivos `.env`, isso é inesperado, já que o Deno tem suporte através da standard library para o módulo dotenv, mas agora você pode usar direto da linha de comando.

Imagine que você tenha um arquivo `.env` na sua raiz do projeto, para executar esse arquivo diretamente você pode passar a opção `--env` para o `deno run`:

```
deno run --env main.ts
```

Você pode especificar o arquivo também:

```
deno run --env=.env.dev mod.ts
```

## Outras mudanças

- Você pode usar qualquer package manager (`yarn`, `pnpm`) para baixar módulos do NPM
- Atrás da flag `--unstable-bare-nod-builtins` você pode agora usar os módulos do Node sem precisar do prefixo `node:`
- Compilacão e transformação mais rápida de JSX
- `deno task` agora suporta o comando `head` em todas as plataformas
- A extensão do VSCode para o Deno agora suporta as opções padrão para JavaScript e TypeScript do próprio code
- A extensão agora tem uma sidebar com todas as tasks do arquivo `deno.json`
- Você pode agora usar `Deno.test` no REPL
- Você pode usar o using com algumas classes do namespace `Deno` como: `FsFile`, `FsWatcher`, `HttpConn`, `HttpServer`, `Kv` e `Listener` 

* * *

## Momento FTS!

Se você curtiu esse artigo, eu também tenho um curso completo de TypeScript chamado **Formação TypeScript!**

Eu te convido a dar uma olhadinha lá se você quiser aprender mais sobre TypeScript comigo e a nossa incrível comunidade com centenas de alunos e alunas!

[

Formação TS

O primeiro e mais completo curso de TypeScript do Brasil

 ![Suporte a env, mudanças de api e novidades do Deno 1.38](https://static-public.pages.hotmart.com/uploads/media/file/6687242/icon-transparent.png)

 ![Suporte a env, mudanças de api e novidades do Deno 1.38](https://static-public.pages.hotmart.com/uploads/media/file/6687239/1200x630.png)
](https://formacaots.com.br/?ref=blog.lsantos.dev)