如何制作漂亮的小npm包并发布

You won’t believe how easy it is!

您将不会相信它是如此简单！

If you’ve created lots of npm modules, you can skip ahead. Otherwise, we’ll go through a quick intro.

如果您创建了很多npm模块，则可以跳过。 否则，我们将快速进行介绍。

TL; DR (TL;DR)

An npm module only requires a package.json file with name and version properties.

npm模块仅需要具有名称和版本属性的package.json文件。

嘿! (Hey!)

There you are.

你在这。

Just a tiny elephant with your whole life ahead of you.

只是一头小象，您的一生将排在您前面。

You’re no expert in making npm packages, but you’d love to learn how.

您不是制作npm软件包的专家，但是您想学习如何做。

All the big elephants stomp around with their giant feet, making package after package, and you’re all like:

所有的大象都用巨大的脚踩着脚踩，一包又一包，就像：

“I can’t compete with that.”

“我无法与之抗衡。”

Well I’m here to tell that you you can!

好吧，我在这里告诉你可以！

No more self doubt.

没有更多的自我怀疑。

Let’s begin!

让我们开始！

你不是大象 (You’re not an Elephant)

I meant that metaphorically.

我的意思是隐喻 。

Ever wondered what baby elephants are called?

有没有想过小象被称为什么？

Of course you have. A baby elephant is called a calf.

当然有 小象叫小牛 。

我相信你 (I believe in you)

Self doubt is real.

自我怀疑是真实的。

That’s why no one ever does anything cool.

这就是为什么没人能做任何很棒的事情。

You think you won’t succeed, so instead you do nothing. But then you glorify the people doing all the awesome stuff.

您认为您不会成功，因此您什么也不做。 但是，随后您就会荣耀那些做所有令人敬畏的工作的人们。

Super ironic.

超级讽刺。

That’s why I’m going to show you the tiniest possible npm module.

这就是为什么我要向您展示最小的npm模块的原因。

Soon you’ll have hoards of npm modules flying out of your finger tips. Reusable code as far as the eye can see. No tricks — no complex instructions.

很快，您将有大量npm模块飞出您的指尖。 可以看到的可重用代码。 没有技巧-没有复杂的说明。

复杂指令 (The Complex Instructions)

I promised I wouldn’t…

我保证不会...

…but I totally did.

…但是我完全做到了。

They’re not that bad. You’ll forgive me one day.

他们还不错。 你有一天会原谅我的

步骤1：npm帐户 (Step 1: npm account)

You need one. It’s just part of the deal.

您必须有一个。 这只是交易的一部分。

Signup here.

在这里注册 。

步骤2：登入 (Step 2: login)

Did you make an npm account?

您是否建立了npm帐户？

Yeah you did.

是的，你做到了。

Cool.

凉。

I’m also assuming you can use the command line / console etc. I’m going to be calling it the terminal from now on. There’s a difference apparently.

我还假设您可以使用命令行/控制台等。从现在开始，我将其称为终端。 显然有区别。

Go to your terminal and type:

转到终端并输入：

npm adduser

You can also use the command:

您还可以使用以下命令：

npm login

Pick whichever command jives with you.

选择与您一起执行的命令。

You’ll get a prompt for your username, password and email. Stick them in there!

系统会提示您输入用户名 ， 密码和电子邮件 。 贴在里面！

You should get a message akin to this one:

您应该收到类似于以下消息：

md tiny

In that folder we need a package.json file. If you already use Node.js — you’ve met this file before. It’s a JSON file which includes information about your project and has a plethora of different options. In this tutorial, we are only going to focus on two of them.

在该文件夹中，我们需要一个package.json文件。 如果您已经使用过Node.js ，那么您之前已经遇到过该文件。 这是一个JSON文件，其中包含有关您的项目的信息，并且有很多不同的选项。 在本教程中，我们仅关注其中两个。

cd tiny && touch package.json

到底有多少呢？ (How small can it really be, though?)

Really small.

真小。

All tutorials about making an npm package, including the official documentation, tell you to enter certain fields in your package.json. We’re going to keep trying to publish our package with as little as possible until it works. It’s a kind of TDD for a minimal npm package.

有关制作npm软件包的所有教程(包括官方文档)都告诉您在package.json中输入某些字段。 我们将继续尝试尽可能少地发布我们的软件包，直到它起作用为止。 这是最小npm包的TDD 。

Please note: I’m showing you this to demonstrate that making an npm package doesn’t have to be complicated. To be useful to the community at large, a package needs a few extras, and we’ll cover that later in the article.

请注意：我向您展示这是为了证明制作npm软件包不必太复杂。 为了对整个社区有用，一个程序包需要一些额外的功能，我们将在本文后面介绍。

发布：首次尝试 (Publishing: First attempt)

To publish your npm package, you run the well-named command: npm publish.

要发布npm程序包，请运行命名命令： npm publish。

So we have an empty package.json in our folder and we’ll give it a try:

因此，我们在文件夹中有一个空的package.json，我们将尝试一下：

npm publish

Whoops!

哎呀！

We got an error:

我们收到一个错误：

{
"name": "@bamlehorse/tiny"
}

You might have noticed that I added my npm username onto the beginning.

您可能已经注意到，我将npm用户名添加到开头。

What’s that about?

那是什么意思

By using the name @bamblehorse/tiny instead of just tiny, we create a package under the scope of our username. It’s called a scoped package. It allows us to use short names that might already be taken, for example the tiny package already exists in npm.

通过使用名称@ bamblehorse / tiny而不是tiny ，我们在用户名范围内创建了一个程序包。 这称为作用域包 。 它允许我们使用可能已经使用的短名称，例如，npm中已经存在该微型软件包 。

You might have seen this with popular libraries such as the Angular framework from Google. They have a few scoped packages such as @angular/core and @angular/http.

您可能已经在流行的库(例如Google的Angular框架)中看到了这一点。 他们有一些范围限定的软件包，例如@ angular / core和@ angular / http 。

Pretty cool, huh?

太酷了吧？

We’ll try and publish a second time:

我们将尝试再次发布：

npm publish

The error is smaller this time — progress.

这次错误较小-进展。

{
"name": "@bamblehorse/tiny",
"version": "1.0.0"
}

Let’s publish!

让我们发布吧！

npm publish

Aw shucks.

糟糕。

npm publish --access=public

Boom!

繁荣！

npm version major

Which outputs:

哪个输出：

npm publish

It is done:

完成：

+ @bamblehorse/tiny@2.0.0

很酷的东西 (Cool stuff)

Package Phobia gives you a great summary of your npm package. You can check out each file on sites like Unpkg too.

软件包Phobia为您提供了npm软件包的精彩摘要。 您也可以在Unpkg等网站上检出每个文件。

谢谢 (Thank you)

That was a wonderful journey we just took. I hope you enjoyed it as much as I did.

那是我们刚刚经历的美好旅程。 希望您能像我一样喜欢它。

Please let me know what you thought!

请让我知道您的想法！

Star the package we just created here:

为我们刚刚在此处创建的包加注星标：

★ Github.com/Bamblehorse/tiny ★ (★ Github.com/Bamblehorse/tiny ★)

Follow me on Twitter, Medium or GitHub

在Twitter ， Medium或GitHub上关注我

翻译自: https://www.freecodecamp.org/news/how-to-make-a-beautiful-tiny-npm-package-and-publish-it-2881d4307f78/

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！