假设你写了一个超级好用的 JavaScript 小片段。 太棒了!干得好,你。 当然,全世界都能从这个中获益。 至少有一小部分人。 不用把它锁起来。 你在职业生涯中从开源中获益良多。 这是一个回馈的好机会!
让我们来做这个。
你需要把它扔到一个 GitHub 仓库中。 对于开源来说,这就像必不可少的东西。 这是人们可以找到它、链接到它、查看代码以及其他所有操作的地方。 如果你需要,它也是一个你可以推送更改的地方。
你需要选择一个许可证。 如果这个的重点是“回馈”,你真的需要这样做,否则,它本质上就像你拥有它的独家版权一样。 有点违反直觉,但选择一个许可证会打开使用权限,而不是收紧它。
你需要在里面放一个 README。 虽然你认为你的代码已经非常自文档化了,但它并不是。 你需要一些简单的语言在里面解释你的东西是什么以及它的作用。 使用示例至关重要。
你可能还想在那里放一些演示。 也许是一个完整的 `/demos/` 目录,这样证明就可以用事实说话了。
在你制作了一些演示之后,你可能也会在里面放一些测试。 它们是相辅相成的。 测试可以让可能使用你东西的人安心,让他们相信它将可以正常工作,以及作为作者,你关心确保它能够正常工作。 如果你计划保持你的东西更新,测试将确保你在进行更改时不会破坏东西。
说到人们使用你的东西... 他们究竟要怎么使用它? 你可能不能只是在 `the-thing.js` 中留一个原始的 `function theThing ()`! 这不是 1800 年代,他们会告诉你的。 你甚至没有用 IIFE 包裹它?! 你至少应该把它做成单例。
人们会想要 `const theThing = require("the-thing.js");` 它。 这是 CommonJS 格式,这似乎是合理的。 但这更适用于 Node.js 而不是浏览器,所以使用 `define()` 并返回一个函数(也称为 AMD)似乎也是合理的。 幸运的是,有UMD,它就像这两个格式同时存在一样。
等等等等。 ES6 现在已经正式到来,它有自己的模块格式。 人们肯定会想要 `import { theThing } from './the-thing.js';`,这意味着你需要 `export function theThing() { }`。
那么你应该在这里做什么? heck 我不知道。 我相信评论中会有人说些什么。
无论你决定做什么,你可能都会将这个“模块”问题与你创作的代码分离。 也许一个构建流程可以帮助你将所有这些组合在一起。 也许你可以提供所有不同的模块格式,这样每个人都会满意。 你用什么来进行构建流程? Grunt? Gulp? 太老了? 现在很酷的是一个 npm 脚本,它只是将一些终端命令放到 `package.json` 文件中。
在进行构建处理时,你可能也会让它运行你的测试。 你也可能要创建一个缩小的版本。 每个库都有一个 `the-thing.min.js`,对吧? 你可能也会把所有这些自动生成的代码放到 `/dist/` 文件夹中。 也许你甚至会非常酷,不会把它检入到仓库中。 如果你想要这个东西,你只需要获取仓库并自己构建它!
尽管如此,你还是希望人们使用这个东西。 有公开仓库还不够,它还需要发布到 npm上,这是一个完全不同的网站和世界。 希望你早些时候做了些命名研究,因为你需要给你的包命名,并且这个名字必须是唯一的。 这里还有很多其他需要注意的东西,比如确保仓库很干净,并且你已经忽略了你不想让每个人都下载的那些东西。
等等,Yarn 是什么? 它不是新版的 npm 还是什么? 你可能还想在那里发布。 一些人仍然坚持使用Bower,所以你可能还想让你的东西在那里也能用。
好了! 完成了! 休息一会儿,准备好应对问题板上不断涌入的需求吧!
只是开玩笑,一切都会好起来的。
关于 README‘s。
Yarn 使用与 npm 相同的注册表,所以你不需要这一步! 太棒了,现在只有 34 个而不是 35 个了!
我对这个问题的看法与我对框架疲劳的看法相同——没错,这很难,但问题可能不在系统本身。 它们在于我们强加的社会义务。
你上面列出的大多数步骤都是可选的,除非你真的希望人们使用你的库——也就是说,你不只是出于纯粹的利他主义,你对看到你的作品被重用有既得利益。
做更多的事情更好,但不是必需的,就像设置缩小你网站的构建工具很好,但没有它网站也能加载。
如果你想让你的代码成为开源代码,你需要做两件事
把它公开放在某个地方(GitHub/Gitlab 是首选,但即使是 Dropbox 也行,如果你不了解 Git 的话)。
给它一个许可证(除非你有充分的理由,否则直接使用 MIT 即可)。
就是这样。 我已经从只有这两种情况的开源库中分叉并使用了代码。 这项工作很费力,如果他们有文档就好了。 但这已经足够了——而且我很感激至少我拥有可以查看的代码,这可以帮助我解决相关问题。
如果你正在构建一个开源“产品”,并且试图与现有的生态系统竞争,那么,是的,你可能需要单元测试、网站、文档、缩小版本的构建和行为准则。 你还需要确保你的代码经过优化,并且与 IE 11 兼容,等等等等。
因为在那个时候,你正在与其他项目竞争——并且你正在投入资源来解决人们遇到的非常现实的问题。
但这不是必须的。 你不需要 React 或特殊的构建工具来为你的本地库设置一个网站。 你不需要单元测试来开源你的黑客马拉松项目。 共享代码很有价值,你可以做很多事情让它更有价值。 但发布你的源代码,即使不好,也比什么都不发布要好得多。
或者直接做一个 gist...
所以你认为它可能只是麻烦大于价值?
是的,你可以 :P 当代码足够简单(例如,一些简单的辅助函数)时,它可能很容易重新包装成库使用者需要的任何东西。 如果有的话,这样的代码可能比其他任何东西都更容易与第三方代码协同工作。
如果代码很复杂(例如,一个库),那么要么它已经正确封装,要么如果它不是这样,它可能具有糟糕的设计。
或者直接发布它,添加一个 readme,热烈感谢第一个克隆它的人,然后礼貌地询问他们是否可以回馈以上内容之一。
重复以上步骤,15 年后你就有了 Drupal 社区。
我的建议是使用 nwb。 它可以轻松地让你构建所有你提到的格式的原生 JavaScript 模块,或者带有测试的 React/Preact 组件!
好吧,所有这些都很棒,但我认为你真正需要的唯一东西是以一种人类可读的方式来告诉“它是什么”、“它的作用”、“它可以在哪里工作”或者可能是“它适合谁”...
有太多“项目”和太多善变的开源贡献者,我们甚至无法猜测!
我实际上想知道其中的一些事情。 像往常一样,干得好,Chris!
嗨,Chris。
很棒的列表! 我个人喜欢库在 CodePen 上为所有配置提供有详细文档的示例。 这就是我在自己的 Siema 上所做的。
关于导出的一句话。 Webpack 带有一系列关于 `output` 对象的有用配置选项。 一个 `output.library` 用于导出命名变量,而 `output.umdNamedDefine` 用于将其导出为 UMD 构建(通用模块定义)。 一个 示例...
感谢你写这篇文章! 我一直很害怕为我的库编写 AMD、CJS 和 UMD。 Webpack 来拯救了!
我还建议这些步骤
• 在你将你的仓库分享给全世界之前,请先找一位朋友进行代码审查。(一旦分享出去,就很难进行大的改动,否则会影响到用户对你的代码的定制化使用。)
• 找到一个和你一样需要这项功能的人,一起维护和开发。结交朋友是开源的意义所在,如果你是一名独行者,当你的问题列表超过1000个未解决问题时,你将无人可以一起哭笑或互相安慰。