Oláoooo!  Espero que você esteja ótimo! Isso é SMY! 👋 Vamos começar 🚀  Conteúdo:  ⚡  Some Background of SDK Development  ⚡  Developing and running our first version  1️⃣ O que -  SDK (às vezes também conhecido como biblioteca) serve como um plug-in em aplicativos para obter recursos adicionais da tecnologia.  2️⃣ Por que -  O desenvolvimento de SDK com TypeScript oferece confiabilidade por um longo tempo devido à segurança de tipo e manutenção a longo prazo.  3️⃣ Como -  As etapas fundamentais necessárias para construir o SDK são as seguintes:  Inicializando o projeto com as configurações corretas de fluxo de trabalho.  Escolhendo o Bundler e entendendo seu propósito.  Noções básicas sobre ESM, CJS, IIFE UMD para executar SDK em diferentes ambientes.  Publicação como biblioteca em NPM, versionamento semântico e licença.  NPM para SPAs e CDN para navegadores.  Na Parte 1, construiremos nosso primeiro SDK básico para obter um entendimento básico.  Etapa 1: inicializar o projeto  Execute o seguinte comando para definir o projeto em uma nova pasta:   npm init -y  O padrão   é sim para todos os prompts de acompanhamento. Você pode alterá-lo posteriormente no Package.json como autor, licença, versão, etc. "-y"  Vá para   e adicione   para funcionar com o sistema EcmaScript Module (ESM) mais recente. package.json type: module  Seu   deve ser parecido com o seguinte: package.json  { "name": "ts-lib", "version": "1.0.0", "description": "SDK development tutorial", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "type": "module", "keywords": [], "author": "", "license": "ISC" }  Etapa 2: instalar bibliotecas de desenvolvimento fundamentais  Texto datilografado    - para trabalhar TypeScript com NodeJS. @types/node    – A maneira mais simples e rápida de agrupar suas bibliotecas TypeScript. tsup  CÓPIA DE   npm i typescript @types/node tsup -D  Etapa 3: configurar   para configurações TypeScript tsconfig  Crie um arquivo   na raiz do projeto. tsconfig.json  CÓPIA DE   touch tsconfig.json  Vá até o arquivo e cole a seguinte configuração:   { "compilerOptions": { /* Base Options: */ "esModuleInterop": true, "allowImportingTsExtensions": true, "emitDeclarationOnly": true, "skipLibCheck": true, "target": "es2022", "allowJs": true, "resolveJsonModule": true, "moduleDetection": "force", "isolatedModules": true, "verbatimModuleSyntax": true, /* Strictness */ "strict": true, "noUncheckedIndexedAccess": true, "noImplicitOverride": true, /* If transpiling with TypeScript: */ "module": "NodeNext", "sourceMap": true, "outDir": "dist", /* AND if you're building for a library: */ "declaration": true, /* If your code runs in the DOM: */ "lib": ["es2022", "dom", "dom.iterable"] }, "exclude": ["node_modules", "dist"] }  Você pode passar o mouse sobre cada propriedade para saber mais sobre ela.  O fundamental a entender aqui é:  "module": "NodeNext", "sourceMap": true, "outDir": "dist",  "   é a opção certa para a criação de bibliotecas porque evita que você emita ESM com especificadores de módulo que funcionam   em bundlers, mas travarão no Node.js. Ao escrever código convencional, usando o bom senso e contando com dependências de alta qualidade, é a saída geralmente é altamente compatível com empacotadores e outros tempos de execução." Você pode aprender mais sobre isso aqui: NodeNext apenas   https://blog.andrewbran.ch/is-nodenext-right-for-libraries-that-dont-target-node-js/    - Permite a geração de arquivos de origem. Esses arquivos permitem que depuradores e outras ferramentas exibam o código-fonte TypeScript original ao trabalhar com os arquivos JavaScript emitidos. Você pode desativá-lo para produção. sourceMap    – Especifique uma pasta de saída para todos os arquivos emitidos. outDir  /* AND if you're building for a library: */ "declaration": true, /* If your code runs in the DOM: */ "lib": ["es2022", "dom", "dom.iterable"]    - Gere arquivos .d.ts a partir de arquivos TypeScript e JavaScript em seu projeto. declaration    - Especifique um conjunto de arquivos de declaração de biblioteca agrupados que descrevem o ambiente de tempo de execução de destino.   é para aplicativos de nó como React e   &   para executar a biblioteca no navegador. lib es2022 dom dom.iterable  Etapa 4: escreva nosso primeiro código  Crie um arquivo   e escreva o seguinte código básico: index.ts   const add = (a: number, b: number): number => a + b; const subtract = (a: number, b: number): number => a - b; export { add, subtract };  Construa nosso primeiro código:  CÓPIA DE   tsup ./index.ts  Agora você pode ver que temos uma pasta   com um arquivo de saída  dist index.cjs  Vamos integrar e executar nosso primeiro SDK!  Crie um arquivo   e cole o seguinte código: app.js   import { add, subtract } from "./dist/index.cjs"; console.log(add(1, 2)); console.log(subtract(2, 1));  Como não publicamos nosso SDK, estamos vinculando diretamente ao build local.  Agora, execute nosso primeiro aplicativo   node app.js  Você deverá ver a seguinte saída:   3 1  Parabéns 🎉🥳 🚀🚀🚀 Acabamos de construir e executar nosso primeiro SDK!  Empacotando:  Acabamos de concluir as etapas básicas para construir e executar nosso primeiro SDK. Vá para a Parte 2, onde construiremos uma estrutura básica de pastas e integraremos um endpoint de API externo 🚀  .....  Agora você está equipado com conhecimento para criar seu próprio SDK. Boa codificação! 🚀  É isso, pessoal! Espero que tenha sido uma boa leitura para você. Obrigado! ✨  👉 Siga-me   GitHub   LinkedIn

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

This story contains new, firsthand information uncovered by the writer.

Read My Stories

View my Portfolio

Full Stack Engineer

Este áudio é produzido no idioma original da história!

Desenvolvimento do SDK TypeScript: uma criança de 5 anos poderia seguir este passo a passo ~ Parte 1: Nosso primeiro MVP

About Author

COMENTARIOS

Rótulos

ESTE ARTIGO FOI APRESENTADO EM

Related Stories

Toque para ganhar: Telegram pode integrar os próximos 10 bilhões de usuários criptográficos antes de Solana

De fóruns a feeds: como os algoritmos de mídia social moldam a interação digital

Quer ganhar um concurso de redação do HackerNoon? Aqui está o que os vencedores do concurso #crypto-api recomendam

As camadas invisíveis: por que as entrevistas com usuários são um ativo insubstituível

Toque para ganhar: Telegram pode integrar os próximos 10 bilhões de usuários criptográficos antes de Solana

De fóruns a feeds: como os algoritmos de mídia social moldam a interação digital

Quer ganhar um concurso de redação do HackerNoon? Aqui está o que os vencedores do concurso #crypto-api recomendam

As camadas invisíveis: por que as entrevistas com usuários são um ativo insubstituível

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps