Netlify Dev-Netlify在本地计算机上的功能

Netlify is never short on new and exciting features. At JAMstack Conf in New York City, they lived up to the hype again. Netlify announced Netlify Dev, allowing you to "run **[our] entire platform on your laptop**". Let's see it in action.

Netlify从不缺少新的令人兴奋的功能 。 在纽约市的JAMstack Conf ，他们再次辜负了宣传。 Netlify宣布推出Netlify Dev ，可让您“在笔记本电脑上运行** [我们的]整个平台**”。 让我们来看看它的作用。

"Preview it all - site generation, functions, and edge logic."

“全面预览-网站生成，功能和边缘逻辑。”

入门 ( Getting Started )

To use Netilfy Dev, you'll just need to add one npm package globally on your machine. If you already have this package installed you may need to update it.

要使用Netilfy Dev，您只需要在计算机上全局添加一个npm软件包即可。 如果您已经安装了此软件包，则可能需要对其进行更新。

npm install netlify-cli -g

With the package installed, inside of your website directory, you can run the following command.

安装该软件包后，您可以在网站目录中运行以下命令。

netlify dev --live

When you run this command, it will automatically figure out how to run your website. This works for the following types of static sites.

当您运行此命令时，它将自动找出如何运行您的网站。 这适用于以下类型的静态站点。

• Gatsby
  盖茨比
• Hugo
  雨果
• Jekyll
  杰基尔
• React Static
  静态React
• Eleventy
  Eleventy
• and MORE!
  和更多！

After running the command, you can see it figured out it needed to run *gatsby develop *to run my site.

运行该命令后，您可以看到它已确定运行* gatsby development *来运行我的站点所需。

连接Netilfy站点 ( Connect A Netilfy Site )

Connecting to an existing Netlify site is easy by running the following command.

通过运行以下命令，可以很容易地连接到现有的Netlify站点。

netlify link

You could also run *netlify init *if you don't already have a site deployed on Netlify. Since my site is connected through my Github repository, I can tell it to do that.

如果尚未在Netlify上部署站点，则也可以运行netlify init 。 由于我的网站是通过Github存储库连接的，因此我可以告诉它这样做。

Note - you might have to authenticate to Netlify to continue.

注意-您可能必须向Netlify进行身份验证才能继续。

Another thing to notice in my logs is that it included an environment variable. It's actually injecting that environment variables from the deployed website into the local build. I use this variable on my site to handle email subscribes. This means you might not ever need local environment properties defined.

在我的日志中要注意的另一件事是它包含一个环境变量。 它实际上是将环境变量从已部署的网站注入到本地版本中。 我在我的网站上使用此变量来处理电子邮件订阅。 这意味着您可能永远都不需要定义本地环境属性。

Note - I still have an open question of whether you can separate between dev and production environment variables

注意-对于是否可以在dev和生产环境变量之间进行区分，我还有一个开放的问题

At the end of the log output, you can see my site started up successfully.

在日志输出的结尾，您可以看到我的网站已成功启动。

直播您的开发服务器 ( Stream Your Development Server Live )

Another piece of the logs that we haven't touched on yet is the fact that my "development server" is available globally.

我们尚未涉及的另一条日志是我的“开发服务器”在全球范围内可用的事实。

And if I go to that URL, I can see my site is actually available!

而且，如果我转到该URL，则可以看到我的网站实际上可用！

网络化功能 ( Netlify Functions )

One last built in feature of using the netlify dev command from above is that is also runs/serves your lambda functions. If you look closely at the logs, you'll see two "connected" messages. One is for your site and the other (the first one below) is for your Netlify Functions.

从上面使用netlify dev命令的最后一个内置功能是，它还可以运行/提供lambda函数。 如果仔细查看日志，将看到两条“已连接”消息。 一个用于您的站点，另一个（下面的第一个）用于您的Netlify功能。

Thanks to this I can no go to postman and test my *subscribe *function which accepts an email, validates it, and sends it off to Mailchimp to add to a mailing list.

由于这个原因，我无法去邮递员测试我的* subscription *函数，该函数接受电子邮件，对其进行验证并将其发送给Mailchimp以添加到邮件列表中。

As you can see in the screenshot below (although it might be small), I sent a post request to *localhost:34567 *(the port for my Netlify Functions), and got a response back!

正如您在下面的屏幕快照中所看到的（尽管它可能很小），我向* localhost：34567 * （我的Netlify Functions的端口）发送了一个发布请求，并得到了回复！

结论 ( Conclusion )

Netlify continues to impress. Netlify dev definitely has some awesome features that are exciting for the future of static site development. I'm excited to see where they go from here and how they continue to improve in everything they do and provide.

Netlify继续给人留下深刻印象。 Netlify开发人员肯定具有一些令人敬畏的功能，这些功能对于静态站点开发的未来是令人兴奋的。 我很高兴看到他们从这里去哪里，以及他们如何在做事和提供的一切方面不断改进。

翻译自: https://scotch.io/tutorials/netlify-dev-the-power-of-netlify-on-your-local-computer