如何创建与环境无关的 JavaScript 库

2024-02-05

我正在创建一个 javascript 库,我希望它与环境无关(它不会使用 DOM、AJAX 或 NodeJS api。它将是普通的 javascript)。因此,它应该可以在任何 javascript 环境中运行(浏览器、npm、meteor 智能包、V8 C 绑定...)。

我目前的方法是使用库创建 git 存储库,将所有库都放在一个全局变量中,而不考虑像 CommonJS 或 AMD 这样的模式。 稍后,我将创建另一个 git 存储库,使用我的库作为 git 子模块,并创建将其作为 npm 模块发布所需的内容。我担心这是否是一个好方法,我没有发现有人这样做。 优点:代码将是普通的 JavaScript,无需了解环境模式。它不会将自身绑定到 CommonJS。它将可重新打包(复制并粘贴或 git 子模块)到任何 javascript 环境。它将根据发送到浏览器所需的大小而定。 缺点:我必须维护与我想要支持的环境一样多的 git。至少有第二个 git 存储库可以在 npm 上交付。

以jQuery为例,它可以在浏览器和nodejs中运行,只有一个git repo。有一些代码需要注意“exports”变量才能在 Nodejs 或其他 CommonJS 兼容环境上运行。 优点:只需维护一个 git 存储库。 缺点:它将绑定到 CommonJS 模式(以实现 npm 兼容性)

我的问题是:我是否遵循正确(或可接受)的方法?或者我应该遵循 jquery 的路径,并尝试创建一个 git 存储库?

更新1:
浏览器化和别的require()图书馆不是有效的答案。我的问题不是如何使用require()相反,在浏览器上,它是关于实现环境不可知论的架构模式。

更新2:
创建浏览器/nodejs模块不是问题, 它被称为 https://stackoverflow.com/questions/7327164/common-module-in-node-js-and-browser-javascript。问题是:可以制作一个真正的环境无关库吗?此示例绑定到 CommonJS 模式,在 NodeJS 中使用。


如果您正在为未来的图书馆工作寻找设计建议,那么在我看来,您可以思考未来,并使用在其他语言、系统和库中得到充分证明的常用面向对象实践。

主要关注设计的 UML 视图。

忘记“一个变量”的要求。

使用计划中的下一版本 JavaScript 中建议的功能。

  • http://wiki.ecmascript.org/doku.php?id=strawman:maximally_minimal_classes http://wiki.ecmascript.org/doku.php?id=strawman:maximally_minimal_classes
  • http://wiki.ecmascript.org/doku.php?id=harmony:modules_rationale http://wiki.ecmascript.org/doku.php?id=harmony:modules_rationale

即使在今天,也有一个实验性的编译器可以让您编写 ES6 风格的代码(请参阅https://www.npmjs.org/package/es6-module-transpiler-rewrite https://www.npmjs.org/package/es6-module-transpiler-rewrite).

Node.js 有一个--harmony允许相同的命令行开关(请参阅`node --harmony` 有什么作用? https://stackoverflow.com/questions/13351965/what-does-node-harmony-do)

所以我认为正确的做法是遵循最佳实践并“思考未来”

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

如何创建与环境无关的 JavaScript 库 的相关文章

  • 使用 javascript 调用 ViewComponent

    我有一个带有几个视图组件的网页 当我单击这些组件时 我会为其打开一个简单的编辑器 请参见下图 如果我编辑文本并按 Enter 键 我想重新渲染视图组件而不是孔页面 是否可以使用 javascript 调用视图组件来获得此行为 通过更新 您现
  • 如何在CKEditor 5中监听焦点事件

    我想听一下 CKEditor 5 中的焦点事件 我认为这样的事情会起作用 但回调从未被调用 document querySelector editable ClassicEditor create el then editor gt edi
  • 通过 HTML5 文件和 URL API 正确创建和提供 PDF Blob

    好吧 假设我有文档数据存储在某处 让我们任意取this pdf http www grida no climate ipcc tar wg1 pdf tar 01 pdf 问题 1 我想要做的是对此 URL 进行 AJAX 调用 因为我需要
  • 未捕获类型错误:无法解析模块说明符“fs”。相对引用必须以“/”、“./”或“../”开头

    当我尝试在我自己的模块中导入 fs 模块时 例如import as fs from fs 浏览器控制台出现以下错误 Uncaught TypeError Failed to resolve module specifier fs Relat
  • WebDriver:更改事件未触发

    我有一个使用 KnockoutJS 的应用程序 我正在尝试编写一些测试表单的测试 如果您不了解 KnockoutJS 简单来说 它提供了从我的视图到我的数据模型的绑定 这意味着当我在输入字段中键入值时 我的基础对象会自动使用该输入字段值进行
  • History.replaceState 仍然向“浏览历史记录”添加条目

    具体来说 调用以下代码片段 history replaceState undefined undefined value 正确地不会影响当前页面的后退按钮行为 但是will在 浏览历史记录 页面添加一个条目 这是我不想要的 下图是 Chro
  • 为什么我的 onclick 事件自动触发

    加载页面时最初显示 Hello World 我希望它仅在单击按钮后显示 我知道我可以通过向按钮添加内联事件侦听器来做到这一点 我可以只用脚本编写所有这些代码吗
  • 如何向尚未添加到页面的元素注册 Javascript 事件处理程序

    我正在尝试构建一个greasemonkey 脚本 它将根据用户与其他动态创建的数据表的交互动态创建数据表 我的问题是 每次创建表时 我都必须进行两次传递 一次用于创建表 另一次用于获取表中我想要添加事件处理程序的所有对象 通过 id 并添加
  • t /= d 是什么意思? Python 和错误

    t current time b begInnIng value c change In value d duration def easeOutQuad swing function x t b c d alert jQuery easi
  • 页面点击其他路径后 $timeout 继续运行

    我在用yo angular fullstack生成器来构建我的网站 当用户注册该网站时 它将发送一封带有链接的激活电子邮件 当用户点击该链接时 会显示激活成功并超时进入主页 但是 当超时未结束 用户点击页面中的任何其他链接时 会跳转到其他页
  • 正则表达式 - 避免表达式中出现字符串

    我正在尝试创建一个应该匹配以下情况的正则表达式 如果单词完全匹配 first second third 那么匹配应该失败 但如果它周围有任何字符 那么应该匹配该字符串 我还需要避免字符串中的某些字符集 如果这些字符是字符串的一部分 则匹配结
  • 禁用任何类型的浏览器窗口滚动?

    有没有办法禁用滚动 不仅仅是滚动条 还有浏览器窗口的全部功能 根据您对 Keit 的回答 您不想在打开灯箱时滚动处于活动状态 如果是这种情况 您可以使用以下 css 在打开灯箱的同时向正文添加一个类 这个解决方案的好处是它保留了滚动 空间
  • Rxjs 可观察等待直到满足某些条件

    我有以下重试逻辑来重试操作 对于单个请求来说它工作得很好 对于多个正在进行的请求 我想在重试之前等待现有的重试逻辑完成 handleError errors Observable
  • Web浏览器控件:如何捕获文档事件?

    我正在使用 WPF 的 WebBrowser 控件加载一个简单的网页 在这个页面上我有一个锚点或一个按钮 我想在我的应用程序后面的代码中 即在 C 中 捕获该按钮的单击事件 WebBrowser 控件是否有办法捕获加载页面元素上的单击事件
  • Google 地图 v3 中标准缩放控件的样式

    有没有一种简单的方法可以在 Google Maps JavaScript API v3 中设置缩放控件的样式 我想要的只是改变标准图像 http maps gstatic com intl en ALL mapfiles mapcontro
  • 如何使用 .append() 将 React 组件附加到 HTML 元素

    我正在尝试对我的博客实现无限滚动 我有 const articlesHTML document querySelector articles 作为容器 每次点击装载更多按钮 我想将新文章附加到主 html 元素 如下所示 const res
  • Jade(当前称为“Pug”)模板引擎中的循环

    我想使用一个简单的循环 例如for int i 0 i lt 10 i 如何在 Jade 引擎中使用它 我正在使用 Node js 并使用expressjs 框架 例如 for var i 0 i lt 10 i li array i 你可
  • 如何在 JavaScript 中设置/更新 String 对象的值

    我有一个具有一些属性的对象字符串对象 var obj foo new String bar 我在用字符串对象因为我需要在对象上存储额外的子属性 同时仍然能够获取字符串值 obj foo baz baz obj foo gt bar 我觉得问
  • 在 中动态添加链接样式表 [关闭]

    这个问题不太可能对任何未来的访客有帮助 它只与一个较小的地理区域 一个特定的时间点或一个非常狭窄的情况相关 通常不适用于全世界的互联网受众 为了帮助使这个问题更广泛地适用 访问帮助中心 help reopen questions 如何将链接
  • 如何仅在第一次访问时弹出模态窗口

    我有一个模式窗口 当您访问某个页面时会弹出 访客必须选择我同意或我不同意 我需要一个漂亮的小 jquery 脚本 它会记住谁之前访问过该页面并同意 这样他们每次访问该页面时就不会弹出模式 有人可以推荐一个好的脚本来使用吗 这是代码 div

随机推荐