如何在 TypeScript 中创建本地模块

2024-04-19

我已经在文件夹中创建了src/modules/my-module/其中有package.json并定义了导出我们需要的所有内容的主文件。

我现在可以从中导入import {A} from '../../modules/my-module'

我想将语法更改为import {A} from 'my-module'我有几个理由:

  • 当我将模块移动到另一个文件夹时,我不想更改调用该模块的所有代码。
  • 后来,我希望能够将该模块作为 npm 包移动到单独的存储库,并在多个项目中重用它。我不想稍后更改所有调用代码。

我已经成功地通过添加来编译它tsconfig.json

"paths": {
  "my-module": ["src/modules/my-module"]
}

但我无法通过 node.js 运行结果,因为节点找不到模块。在这种情况下有没有办法使用非相关模块引用。


听起来,你想做的是打包你本地的my-module这样它就可以像安装和使用 npm 注册表中的包一样使用.

当您进行本地开发时,可以轻松配置依赖项以将模块引用为文件路径 - 尽管您需要转换打字稿才能使其在您的情况下工作。

这是我用于本地开发的方法,在一个环境中,我们有许多用于微服务架构的实用程序模块。我将模块打包到存档中并使用安装它npm install:


  • Use npm pack https://docs.npmjs.com/cli/v7/commands/npm-pack将模块打包成.tgz. Our package.json定义要打包的目标目录,以及build脚本执行到目标的转译(显然根据您的需要进行调整):
  ...
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "files": [
    "dist"
  ],
  "scripts": {
    "build": "npx babel src --out-dir dist --extensions .ts,.tsx,.js --ignore **/*.test.ts,**/*.test.tsx",
  ...
  • Run npm pack并将生成的包安装到您的应用程序中
/my-module/> npm pack
/my-module/> cd ../my-app
/my-app/> npm install --save ../my-module/my-module-0.0.1.tgz

或者作为一个多合一(构建tgz in my-app dir):

/my-app/> && npm pack ../my-module && npm i -s my-module-0.0.1.tgz

完成开发后,您可能希望以可在部署时供项目使用的方式发布模块。

您的选择大致如下:

  • 使用发布到您的本地系统npm link
  • 发布到私有注册表
  • 发布到 npm 注册表(作为公共或私有模块)

以下是这些选项的好资源:https://medium.com/@debshish.pal/publish-a-npm-package-locally-for-testing-9a00015eb9fd https://medium.com/@debshish.pal/publish-a-npm-package-locally-for-testing-9a00015eb9fd

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 TypeScript 中创建本地模块 的相关文章

  • JavaScript 设置滚动高度

    在 JavaScript 中 将一个元素的滚动高度设置为另一个元素的滚动高度的正确方法是什么 直接赋值没有效果 谢谢 格雷格 直接是不可能的 scrollHeight 是一个只读属性 包含元素内容的总高度 以像素为单位 如果有元素 A 并且
  • Vuex 2.0 调度与提交

    有人可以解释一下什么时候使用调度和提交吗 我理解提交会触发突变 调度会触发操作 然而 派遣不也是一种行动吗 正如你所说 dispatch触发一个动作 并且commit触发突变 以下是如何使用这些概念 你总是用 dispatch来自路线 组件
  • 空 JavaScript 数组的布尔值冲突

    谁能解释为什么以下两个陈述都评估为true false and 这个问题纯粹是出于对为什么会发生这种情况的好奇 而不是关于如何最好地测试数组是否为空 第一个 false The 运算符对其操作数进行类型转换 在这种情况下 两边都转换为 Nu
  • 使用 ES6 从子级获取父类名?

    我想获取父类名称 Parent 但我只能使用此代码检索子类名称 Child use strict class Parent class Child extends Parent var instance new Child console
  • Angular 2 从 Observable 获取项目的方法

    给定 Angular 2 服务中的以下 Typescript getLanguages return this http get this languagesUrl map res gt
  • 在 Sequelize 中添加带有起始值的自动递增整数

    经过一些研究 我似乎无法找到执行以下操作的好方法 我不想向现有表添加新列 该列应该是一个自动递增整数 从值 1000 开始 我的迁移文件现在简单明了 use strict module exports up queryInterface S
  • 从 ElementFinder 数组创建 ElementArrayFinder

    这是一个后续问题当条件评估为 true 时获取元素 扩展 ElementArrayFinder https stackoverflow com questions 32572299 take elements while a conditi
  • 测试期间的 Mocha beforeEach 和 afterEach

    我一直在尝试使用摩卡测试我的测试服务器 这是我使用的以下代码 与另一篇类似帖子中找到的代码几乎相同 beforeEach function done Setup console log test before function ws on
  • Vue.js:折叠/展开父级中的所有元素

    我需要为我的 Vue 组件 一些可折叠面板 添加 展开 折叠全部 功能 如果用户单击折叠按钮 然后单击某个面板并将其展开 然后单击折叠按钮不会做任何事因为观看的参数不会改变 那么如何正确实现此功能 按钮必须始终折叠和展开组件 我准备了简单的
  • selenium webdriver 管理器更新 - npm

    我尝试使用 webdriver manager 更新 selenium webdriver 但出现错误 Error Got error Error read ECONNRESET from https selenium release st
  • 从 jsonp fetch Promise 获取 json

    我刚刚开始使用react native 并且我正在以文档中的经典示例作为基础 fetch https facebook github io react native movies json then response gt response
  • 带点符号的 Typescript 深度省略

    由于 TypeScript 现在支持模板文字类型 是否可以有类似以下内容 interface Data a number b c number d number type OmitDeep
  • 在 React 中渲染来自 Firebase 的数据

    请帮助我渲染从 Firebase 实时数据库检索的数据 我成功从 Firebase 中以数组形式检索数据 下一步是显示数据 问题就从这里开始了 我想要显示的数据应该存储在 模块 状态 首先 它被设置为一个空数组 然后检索数据 通过 Coum
  • 客户端与服务器端图像压缩[关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在研究用户可以上传图片的东西 图像大小不受限制 现在我有两个选择使用PHP 服务器端 压缩图像或使用
  • 检测 html 元素内的用户选择

    如何检测用户选择 用鼠标突出显示 是否在某个元素内 某个元素的子元素 Example div sdfsdf div some span content span div sdfsd div 伪代码 if window getSelectio
  • 如何使用Javascript统计通过ajax返回的
  • 的数量?
  • 我有一个 ajax 代码 它将列表项返回为 li one li li Two li 每次都会返回不同数量的 li 的 我想查一下数量 li li 它返回 如何使用 JavaScript 检查它 给你 returnedHTML find li
  • 角度文件上传

    我是 Angular 的初学者 我想知道如何创建 Angular 5文件上传部分 我试图找到任何教程或文档 但我在任何地方都没有看到任何内容 有什么想法吗 我尝试过ng4 文件 https github com bonjurmrfirst
  • 与 Typescript 结合使用Reducers 返回错误“类型参数不可分配给‘ReducersMapObject’类型参数”

    我正在尝试使用react redux typescript 设置一个前端环境 但我很难让它与combineReducers 一起工作 我收到错误 类型参数不可分配给 ReducersMapObject 类型的参数 请参阅代码下方的完整错误消
  • jQuery find() 只返回第一个匹配的结果?

    我在 jQuery 中使用 find 方法 但无法获得与选择器条件匹配的所有结果 这是我的 HTML div class something div
  • Openlayers 3 中心地图

    我在唱歌开放层 3 http openlayers org en v3 0 0 apidoc 显示地图 我想使用经纬度坐标将地图居中 我正在使用快速入门代码 http openlayers org en v3 1 1 doc quickst

随机推荐

  • R 中的旋转轴标签

    如何使 条形 图的 y 轴标签平行于 X 轴而不是平行于 Y 轴 不确定这是否是您的意思 但尝试设置las 1 这是一个例子 require grDevices tN lt table Ni lt stats rpois 100 lambd
  • php中比较字符串的方法

    我想比较两个字符串并返回比较级别 字符串 1 是输入 可以采用来自客户端的多种格式 例如 string 1 GCSE English Lang Year 10 or string 1 Year 10 Eng Lang GCSE etc 字符
  • 如何在 VB.NET 中调用异步 Web 请求?

    我目前正在使用以下代码来创建网络请求 Dim myRequest As WebRequest WebRequest Create http foo com bar Dim myResponse As WebResponse myReques
  • 在 iOS 中加载/保存设置

    我在 AppDelegate 中定义了以下两个过程 保存设置和加载设置 单击保存按钮后 我将在 AppDidFinishLaunching 方法中调用 loadSettings 过程 并在设置视图中调用 saveSettings 过程 这两
  • 从外部源填充运行时天蓝色管道参数

    我们希望创建一个管道来更新我们的多租户 Azure 环境 我们需要在每个租户的更新过程中执行一些操作 为了实现这一目标 我们希望为每个租户创建一个作业 以便我们可以并行处理租户 为了实现此目的 我想使用运行时参数来传递租户以更新到我的管道
  • OSX 中的 python 地穴

    我有一个 Django 应用程序 它可以重置 Ubuntu 机器上运行的 unix 用户密码 但我的开发环境是 OS X 我遇到了这种恼人的情况 OS X gt gt gt import crypt gt gt gt crypt crypt
  • C/C++:如何将数据存储在B树中的文件中

    在我看来 将数据作为文件存储在 B 树中的一种方法可以使用 C 语言使用具有结构序列 数组 的二进制文件来有效完成 每个结构代表一个节点 因此 我们可以使用类似于使用数组创建链表的方法来连接各个节点 但随之而来的问题是删除节点 因为在一个大
  • “RPC 服务器不可用。”循环遍历Word文档时

    我正在开发一个实用程序来查找和更新 Word 中的 DOC 变量 我有一段代码可以循环遍历文档并显示带有变量名称的消息框 但是当它尝试打开下一个文档时收到错误 错误是 System Runtime InteropServices COMEx
  • 加入日历表 - 5 个工作日

    所以这是这里的一个常见问题 但我还没有找到真正适合我的特定需求的答案 我有 2 张桌子 其中有一个 ProjectClosedDates 列表 另一个表是一个类似于 2025 年的日历表 其中包含表示行日期是否为周末的列 以及另一列表示假日
  • php 中的 SVG 到 PNG 图像转换

    我想将 SVG 图像转换为具有透明背景的 PNG 文件 我使用下面的代码在 php 中使用 imagick 对其进行转换 但它给出了黑色背景的图像 image new imagick set transparent background i
  • 在 O(n) 中获取作为唯一给定索引的函数的排列

    我想要一个函数get permutation给定一个列表l和一个索引i 返回一个排列l这样排列对于所有人来说都是唯一的i大于0并低于n where n len l I e get permutation l i get permutatio
  • 如何在 OpenCV 中绘制图像的 3D 直方图

    更新 我找到更多例子 我现在可以做到 我可以在 3d 中绘制多个直方图吗 https stackoverflow com questions 35210337 can i plot several histograms in 3d 我知道这
  • 标准化浮点数 f 之后(之前)的下一个标准化浮点数是什么?

    给定一个标准化浮点数 f 下一个是什么归一化f 之后 之前的浮点数 通过一些调整 提取尾数和指数 我有 next normalized double if mantissa is not all ones maximally denorma
  • 如何快速过滤 Realm 中为当前日期创建的事件?

    如何快速过滤 Realm 中为当前日期创建的事件 我尝试了类似下面的方法 但是这是错误的 let dtSource datasource filter Create NSDate count Update 获取将我的日期创建为字符串的过滤器
  • Python json内存膨胀

    import json import time from itertools import count def keygen size for i in count 1 s str i yield 0 size len s str s de
  • 设置子视图以适合系统窗口

    我正在设置一个简单的视图 其中仅包含一个空的RelativeLayout
  • 如何启动第二个 Java 进程?

    如何启动第二个独立于平台的 Java 进程 理想情况下 它应该与当前运行的 Java 版本相同 有什么有用的系统属性吗 您可以使用java home系统属性来查找当前的 JVM String jvm new java io File new
  • 如何以编程方式获取 iOS 状态栏高度

    我知道目前 iPhone iPad 顶部的状态栏 包含时间 电池和网络连接 对于非视网膜屏幕为 20 像素 对于视网膜屏幕为 40 像素 但为了未来证明我的应用程序 我希望无需硬编码值即可确定这一点 是否可以通过编程计算出状态栏的高度 UI
  • Q_PROPERTY NOTIFY 信号及其参数

    我有写 propertyChanged 的习惯signals 带参数 这样接收端就不需要调用Q PROPERTY s READ明确地发挥作用 我这样做是出于清晰的考虑 并且假设在 QML 数据绑定情况下 不需要对 getter 进行 昂贵
  • 如何在 TypeScript 中创建本地模块

    我已经在文件夹中创建了src modules my module 其中有package json并定义了导出我们需要的所有内容的主文件 我现在可以从中导入import A from modules my module 我想将语法更改为imp