你好！ 希望你一切顺利！这是 SMY！👋 让我们马上开始 🚀 内容：  ⚡  Some Background of SDK Development  ⚡  Developing and running our first version  1️⃣ 什么-  SDK（有时也称为库）作为应用程序中的插件，从该技术中获取附加功能。  2️⃣为什么- 使用 TypeScript 进行 SDK 开发由于类型安全和长期维护而具有长期可靠性。  3️⃣ 如何- 构建 SDK 所需的基本步骤如下： 使用正确的工作流程设置初始化项目。 选择 Bundler，并了解其用途。 了解 ESM、CJS、IIFE UMD 以便在不同环境中运行 SDK。 作为 NPM 上的库发布、语义版本控制和许可证。 用于 SPA 的 NPM 和用于浏览器的 CDN。 在第 1 部分中，我们将构建我们的第一个基本 SDK 以获得基本了解。 步骤 1：初始化项目 运行以下命令将项目设置在新文件夹中：   npm init -y   默认对所有后续提示都为“是”。您可以稍后在 Package.json 中更改它，例如作者、许可证、版本等。 "-y" 转到  ，并添加 以使用最新的 EcmaScript 模块系统（ESM）。 package.json type: module 你的 应该如下所示： 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" } 第 2 步：安装基础开发库 TypeScript   将 TypeScript 与 NodeJS 一起使用。 @types/node    - 捆绑 TypeScript 库的最简单、最快捷的方法。 tsup 复制 npm i typescript @types/node tsup -D 步骤 3：设置 以进行 TypeScript 设置 tsconfig 在项目根目录创建一个 文件。 tsconfig.json 复制 touch tsconfig.json 转到该文件并粘贴以下配置：   { "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"] } 您可以将鼠标悬停在每个属性上以更深入地了解它。 这里要理解的基本内容是：  "module": "NodeNext", "sourceMap": true, "outDir": "dist",  “  是编写库的正确选择，因为它可以防止您发出带有模块说明符的 ESM，这些模块说明符 在捆绑器中有效，但在 Node.js 中会崩溃。当编写常规代码、使用常识并依赖高质量依赖项时，其输出通常与捆绑器和其他运行时高度兼容。”您可以在此处了解更多信息： NodeNext 仅   https://blog.andrewbran.ch/is-nodenext-right-for-libraries-that-dont-target-node-js/    - 启用源文件的生成。这些文件允许调试器和其他工具在处理发出的 JavaScript 文件时显示原始 TypeScript 源代码。您可以针对生产禁用它。 sourceMap   为所有发出的文件指定一个输出文件夹。 outDir  /* AND if you're building for a library: */ "declaration": true, /* If your code runs in the DOM: */ "lib": ["es2022", "dom", "dom.iterable"]    - 从项目中的 TypeScript 和 JavaScript 文件生成 .d.ts 文件。 declaration    - 指定一组描述目标运行时环境的捆绑库声明文件。es2022 适用于 React 等节点 程序，  和 用于在浏览器中运行库。 lib es2022 dom dom.iterable 步骤 4：编写第一个代码 创建一个 文件，并写入以下基本代码： index.ts   const add = (a: number, b: number): number => a + b; const subtract = (a: number, b: number): number => a - b; export { add, subtract }; 构建我们的第一个代码： 复制 tsup ./index.ts 您现在可能会看到我们有一个 文件夹，其中有一个输出文件 dist index.cjs 让我们集成并运行我们的第一个 SDK！ 创建一个 文件，并粘贴以下代码： app.js   import { add, subtract } from "./dist/index.cjs"; console.log(add(1, 2)); console.log(subtract(2, 1)); 由于我们尚未发布我们的 SDK，因此我们直接链接本地构建。 现在，运行我们的第一个应用程序 node app.js 您应该看到以下输出：   3 1 恭喜🎉🥳🚀🚀🚀我们刚刚构建并运行了我们的第一个 SDK！ 包起来： 我们刚刚完成了构建和运行第一个 SDK 的基本步骤。请转到第 2 部分，我们将在其中构建一个基本文件夹结构，并集成一个外部 API 端点 🚀  ..... 现在，您已经掌握了构建自己的 SDK 的知识。祝您编码愉快！🚀 就这样吧，朋友们！希望你们读起来愉快。谢谢！✨  👉 关注我 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

該音頻是用故事的原始語言製作的！

TypeScript SDK 开发：5 岁小孩也能循序渐进学习~第 1 部分：我们的第一个 MVP

About Author

註釋

標籤

这篇文章刊登在

Related Stories

HackerNoon Decoded: The Top 10 Countries Where HackerNoon Is the Most Active

数字游民请注意：您需要了解泰国新推出的 DTV 签证

从论坛到信息流：社交媒体算法如何塑造数字互动

创建以用户为中心的加密产品：客户反馈的重要性

HackerNoon Decoded: The Top 10 Countries Where HackerNoon Is the Most Active

数字游民请注意：您需要了解泰国新推出的 DTV 签证

从论坛到信息流：社交媒体算法如何塑造数字互动

创建以用户为中心的加密产品：客户反馈的重要性

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps