5 npm技巧和窍门可帮助您提高生产力-CSDN博客

While this article will likely boost your productivity, at the very least it will also impress some of your colleagues with your new skills. People will now perceive you as smarter and potentially more interesting. 😎

尽管这篇文章可能会提高您的生产率，但至少也可以使您的一些新技能给您的同事留下深刻的印象。人们现在会认为您更聪明，可能会更有趣。 😎

I've kept away from the obvious shortcuts and tried to share information you probably don't know.

我远离明显的快捷方式，并尝试共享您可能不知道的信息。

If you want the video version check it out below. If you are happy reading, then scroll on my friend... 📚

如果您想要视频版本，请在下面查看。如果您喜欢阅读，请在我的朋友上滚动...📚

1.列出可用的脚本 (1. List available scripts)

To easily check all the available scripts in a project just run:

要轻松检查项目中所有可用的脚本，只需运行：

npm run

This gives you a lovely output showing you the commands like this:

这会给您一个可爱的输出，向您显示如下命令：

2.列出已安装的软件包 (2. List installed packages)

npm list

This shows us probably too much because we see the dependencies of our dependencies…

这可能显示了太多信息，因为我们看到了依赖项的依赖项…

Use the --depth to limit the depth of your search

使用--depth限制搜索的深度

npm list --depth=0

And here you can see the output when you limit the depth:

在这里，您可以在限制深度时看到输出：

3.打开软件包的主页或仓库 (3. Open a package's homepage or repo)

I really like this feature because you can quickly get the documentation for the packages.

我非常喜欢此功能，因为您可以快速获取软件包的文档。

To automatically open the packages homepage you can run:

要自动打开软件包主页，可以运行：

npm home PACKAGE_NAME

To open the repository you can just run:

要打开存储库，您可以运行：

npm repo PACKAGE_NAME

This is super handy so you don't have to go Googling looking for the docs or npm pages and can quickly access the information you need on packages you don't know.

这非常方便，因此您不必去谷歌搜索文档或npm页面，就可以快速访问您不知道的软件包所需的信息。

4.显示软件包的所有可用版本 (4. Show all the available versions for a package)

To get the latest version of a package we can run:

要获取软件包的最新版本，我们可以运行：

npm v react version

Or for all the versions we just have to make "version" plural.

或对于所有版本，我们只需要使“版本”复数即可。

npm v react versions

We then get a lovely output of all the available versions which is super handy if you want to check what's new/old or if there are any alpha releases to try out.

然后，我们会获得所有可用版本的漂亮输出，如果您想查看新的/旧的或有任何Alpha版本可以尝试的话，这非常方便。

Here's a piece of the output from running npm v react versions:

这是运行npm v react versions的一部分输出：

5.寻找过时的包裹 (5. Look for outdated packages)

The outdated command will check the npm registry to see if any of your packages are outdated. It will print out a little table in your command line showing the current version, the wanted version, and the latest version.

outdated命令将检查npm注册表，以查看您的任何软件包是否已过时。它将在您的命令行中打印出一张小表，显示当前版本，所需版本和最新版本。

npm outdated

If you see the packages in red like in my sample it means there are some major vulnerabilities and they should be updated. As you can see in this 4-year-old project it's all a nice healthy red...

如果像我的示例中那样看到红色的软件包，则意味着存在一些主要漏洞，应该对其进行更新。正如您在这个已有4年历史的项目中所看到的，它都是健康的红色...

If you want versions different than your current version you can actually run npm update to safely update these packages.

如果您想要的版本与当前版本不同，则可以实际运行npm update来安全地更新这些软件包。

I think a better way for updating and checking for outdated stuff is actually running the npm audit command, as it gives a lot more detail. I didn't include it as a tip because it's always screaming at us to run it in the console when we install dependencies.

我认为更新和检查过时的内容的更好方法实际上是运行npm audit命令，因为它提供了更多详细信息。我没有将其作为提示，因为在安装依赖项时，它总是在向我们尖叫以在控制台中运行它。

Visual Studio代码奖金提示！ 🏆 (Visual Studio Code Bonus Tip! 🏆)

A lot of people don't know this but you can actually run your scripts directly from inside Visual Studio Code with their lovely interface.

很多人不知道这一点，但是实际上您可以使用其漂亮的界面直接在Visual Studio Code内部运行脚本。

Look for the "NPM Scripts" on the bottom left of your panel.

在面板的左下方查找“ NPM脚本”。

You can open your scripts from here and just press the play icon to kick it off. I like this because it's a clear and easy way to do things for people that might not be too familiar with npm.

您可以从此处打开脚本，然后按播放图标将其启动。我喜欢这样，因为这是一种为可能不太熟悉npm的人做事的清晰而简便的方法。

If you can't see this make sure it's active in your settings. 💜

如果看不到它，请确保它在您的设置中处于活动状态。 💜

Follow me on Twitter

在推特上关注我

Subscribe on Codú Community

在Codú社区订阅