Skip to content

【译】发布你自己的npm包 #25

Open
@reng99

Description

@reng99
Owner

banner

备注:npm模块有个神奇的样板。这篇文章是基于我从设置中学到的东西。

如今,NPM已经成为javascript库的事实上的注册表。特别是React,Angular和其他前端库主导的网络和node.js接管的服务器端,NPM软件包比以往任何时候都更受欢迎。通常,我们会在代码中引入实用包,比如typysugar,并轻松的使用它们。

那么,你有没有想过编写自己的实用程序/库,并将其发布到NPM上面,以便在世界任何的地方可以重复使用它?如果是,那就继续阅读。✨

我们将在本文中介绍以下部分。

  1. 为什么?
  2. 发布的步骤
  3. 样板文件

为什么?

当你在多个项目中工作时,你经常发现自己在多个项目中重复简单的事情。举个例子,以你想要的方式解析日期并对其进行格式化。大多数开发者只是从一个项目复制代码到另一个项目中使用它,因为它只是几行代码。但更好的方法是提取代码并将其放在一个公共的位置,以便你可以从任何项目中访问它。NPM是一个理想且不断发展的生态系统,并且可以免费使用它。所以,从长远看,将所有可重用代码作为npm包发布上去将会帮助到你。

无论代码有多少,无论是一行还是一千行,都可以将其作为包发布,以便在多个代码库中轻松使用。

此外,你还可以成为这个库的作者。多么酷啊!😎

发布的步骤

发布通常是一个简单的过程。

code => test => publish => revise code => test => publish new version ...

入口

创建一个新目录(,进入目录)并从终端输入以下命令。

npm init

(根据提示)输入有意义的包名称和包的相应详细信息。这将为你创建package.json。所有NPM包都需要main键。这定义了我们库的入口点。默认情况下,这入口点将是index.js,但是你可以根据你自己的情况来更改入口点(文件)。

对于Babel或基于bundle的库,入口点通常位于构建目录中。

源码

如果你正在编写一个小型库,则可以将所有代码放入index.js中。但是,更常见的是,我们将抽象代码并将其放入单独的文件中。所以,理想的方法是将所有源代码保存在src中。

这是目前最广泛使用和推荐的源代码设置,尽管它从一个库到另一个库中有所不同。

我们大多数的人已经知道(上面)这些事,所以,我仅仅列出来,把它们留给你弄清楚。

测试

你需要进行全面测试,以确保你的代码按照预期工作。有各种测试设置。你可以使用最适合你需求的。那么,广泛使用的测试设置有

... 等等

如果你需要代码覆盖率,我很喜欢(覆盖率),Istanbul是任何JavaScript项目的最佳覆盖工具之一。我非常喜欢它。

发布

一旦你的代码通过了测试,那么可以准备发布了。

  1. npmjs.com中创建一个账号。
  2. 在控制台上运行下面的指令
npm login

输入你的用户名和密码。这将存储凭据,因此你不必为每次发布输入凭据。

  1. 现在去发布,运行(下面指令)
npm publish

这会将你的包发布到NPM注册表。发布完成后(不到一分钟),你可以在链接https://www.npmjs.com/~{username}/{package-name}中查看你的包。

如果你想对包进行更改,则必须更改版本号并再次发布。

请记住使用npm命令npm version patchnpm version minornpm verson major来自动更新版本,而不是手动更新它们。这些命令是基于语义版本控制

样板文件

我有一些我自己的npm软件包,并在线研究了创建NPM软件包的所有最佳实践,并专门为此创建了样板文件。它具有预先设置的所有功能,以便你可以在几秒钟内开始使用。如果你正在寻找编写JavaScript util包,它可能只是你的样板。

样板文件的链接 -- npm-module-boilerplate

你是最棒的!祝你度过美好的一天!🎉

后话

原文:https://hackernoon.com/publish-your-own-npm-package-946b19df577e

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    bloga single blogtranslationtranslate somehing

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @reng99

        Issue actions

          【译】发布你自己的npm包 · Issue #25 · reng99/blogs