块编辑器开发文档

Node.js 开发环境

💡 云策文档标注

概述

本文档介绍了为 Block Editor 开发设置 Node.js 环境的核心步骤,包括 Node.js 的作用、npm 和 npx 工具的使用,以及在 Mac/Linux 和 Windows 上的安装方法。

关键要点

  • Node.js 是用于从终端执行 JavaScript 代码的开源运行时环境,是 Block Editor 开发的必备工具。
  • 安装 Node.js 会自动包含 npm(用于依赖管理和脚本执行)和 npx(用于运行包命令而无需全局安装)。
  • 在 Mac 和 Linux 上,推荐使用 nvm 安装 Node.js,以避免全局权限问题并管理特定版本。
  • 在 Windows 上,可以直接从 Node.js 官网下载安装程序或参考 Microsoft 的详细指南。
  • 安装后需验证 node 和 npm 版本,并注意项目可能通过 .nvmrc 文件指定 Node.js 版本。

代码示例

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.5/install.sh | bash
nvm install --lts
node -v
npm -v
nvm install 18
nvm use 18

注意事项

  • 在 macOS 上,如果遇到 zsh: command not found: nvm 错误,可能需要创建默认配置文件(如 ~/.zshrc)。
  • 某些项目或工具可能有特定的 Node.js 版本要求,建议检查 .nvmrc 文件并使用指定版本。
  • 最新 Node.js 版本通常适用,但遇到问题时可能需要安装旧版本。

📄 原文内容

When developing for the Block Editor, you will need Node.js development tools along with a code editor and a local WordPress environment (see Block Development Environment). Node.js (node) is an open-source runtime environment that allows you to execute JavaScript code from the terminal (also known as a command-line interface, CLI, or shell)

Installing node will automatically include the Node Package Manager (npm) and the Node Package eXecute (npx), two tools you will frequently use in block and plugin development.

Node Package Manager (npm) serves multiple purposes, including dependency management and script execution. It’s the recommended package manager and is extensively featured in all documentation.

The Node Package eXecute (npx) tool is used to run commands from packages without installing them globally and is commonly used when scaffolding blocks with the create-block package.

Node.js installation on Mac and Linux (with nvm)

It’s recommended that you use Node Version Manager (nvm) to install Node.js. This allows you to install and manage specific versions of node, which are installed locally in your home directory, avoiding any global permission issues.

Here are the quick instructions for installing node using nvm and setting the recommended Node.js version for block development. See the complete installation guide for more details.

  1. Open the terminal and run the following to install nvm. On macOS, the required developer tools are not installed by default. Install them if prompted.
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.5/install.sh | bash
  1. Quit and restart the terminal.
  2. Run nvm install --lts in the terminal to install the latest LTS (Long Term Support) version of Node.js.
  3. Run node -v and npm -v in the terminal to verify the installed node and npm versions.

If needed, you can also install specific versions of node. For example, install version 18 by running nvm install 18, and switch between different versions by running nvm use [version-number]. See the nvm usage guide for more details.

Some projects, like Gutenberg, include an .nvmrc file which specifies the version of node that should be used. In this case, running nvm use will automatically select the correct version. If the version is not yet installed, you will get an error that tells you what version needs to be added. Run nvm install [version-number] followed by nvm use.

Node.js installation on Windows and others

You can download a Node.js installer directly from the main Node.js website. The latest version is recommended. Installers are available for Windows and Mac, and binaries are available for Linux.

Microsoft also provides a detailed guide on how to install nvm and Node.js on Windows and WSL.

Troubleshooting

If you encounter the error zsh: command not found: nvm when attempting to install node, you might need to create the default profile file.

The default shell is zsh on macOS, so create the profile file by running touch ~/.zshrc in the terminal. It’s fine to run if the file already exists. The default profile is bash for Ubuntu, including WSL, so use touch ~/.bashrc instead. Then repeat steps 2-4.

The latest node version should work for most development projects, but be aware that some packages and tools have specific requirements. If you encounter issues, you might need to install and use a previous node version. Also, make sure to check if the project has an .nvmrc and use the node version indicated.

Additional resources