如何在 Ubuntu 22.04 LTS 上安装 ReactJS

在本教程中,我们将向您展示如何在 Ubuntu 22.04 LTS 上安装 ReactJS。 对于那些不知道的人,React(也称为 React.js 或 ReactJS)是一个用于创建 Web 前端和 UI 组件的开源 JavaScript 前端库。 许多开发人员正在使用它,因为它的灵活性、完整性以及将 Html 直接带入 JS 的特性。

本文假设您至少具备 Linux 的基本知识,知道如何使用 shell,最重要的是,您将网站托管在自己的 VPS 上。 安装非常简单,假设您在 root 帐户下运行,如果不是,您可能需要添加 ‘sudo‘ 到命令以获取 root 权限。 我将向您展示在 Ubuntu 22.04 (Jammy Jellyfish) 上逐步安装 ReactJS。 对于 Ubuntu 22.04 和任何其他基于 Debian 的发行版,如 Linux Mint、Elementary OS、Pop!_OS 等,您可以按照相同的说明进行操作。

先决条件

  • 运行以下操作系统之一的服务器:Ubuntu 22.04、20.04 和任何其他基于 Debian 的发行版,如 Linux Mint。
  • 建议您使用全新的操作系统安装来防止任何潜在问题。
  • 对服务器的 SSH 访问(或者如果您在桌面上,则只需打开终端)。
  • 一个 non-root sudo user或访问 root user. 我们建议充当 non-root sudo user,但是,如果您在充当 root 时不小心,可能会损害您的系统。

在 Ubuntu 22.04 LTS Jammy Jellyfish 上安装 ReactJS

步骤 1. 首先,通过运行以下命令确保所有系统包都是最新的 apt 终端中的命令。

sudo apt update sudo apt upgrade sudo apt install wget apt-transport-https gnupg2 software-properties-common

步骤 2. 安装 Node.Js。

现在运行以下命令下载并执行 NodeSource 安装脚本:

curl -sL https://deb.nodesource.com/setup_18.x | sudo bash -

之后,使用以下命令将 Node.js 安装到您的系统:

sudo apt install nodejs

最后,检查当前活动的 Node.js 版本:

node -v npm -v

步骤 3. 在 Ubuntu 22.04 上安装 ReactJS。

现在我们设置了创建 React 应用程序所需的所有设置和工具:

sudo npm install -g create-react-app

验证安装的版本 create-react-app 使用以下命令:

create-react-app --version

第 4 步。创建您的第一个 React 应用程序。

您可以使用以下命令创建 ReactJS 应用程序:

sudo create-react-app myreactapp

输出:

Success! Created myreactapp at /home/react/myreactapp Inside that directory, you can run several commands:    npm start     Starts the development server.    npm run build     Bundles the app into static files for production.    npm test     Starts the test runner.    npm run eject     Removes this tool and copies build dependencies, configuration files     and scripts into the app directory. If you do this, you can’t go back!  We suggest that you begin by typing:    cd myreactapp   npm start

创建应用程序后,切换到该项目并运行 npm start 启动应用程序:

cd myreactapp npm start

输出:

Compiled successfully!  You can now view myreactapp in the browser.  Local: https://localhost:3000 On Your Network: https://192.168.77.20:3000  Note that the development build is not optimized. To create a production build, use npm run build.

步骤 5. 创建系统服务。

现在我们创建一个 systemd 为您的 React 应用程序提供服务。 因此,您可以使用 systemctl 命令:

sudo nano /lib/systemd/system/react.service

添加以下文件:

[Unit] After=network.target  [Service] Type=simple User=root WorkingDirectory=/home/react/myreactapp ExecStart=/usr/bin/npm start Restart=on-failure  [Install] WantedBy=multi-user.target

Save 和 close 文件,然后重新加载 systemd 使用以下命令的守护进程:

sudo systemctl daemon-reload sudo systemctl start react sudo systemctl enable react

步骤 6. 访问 ReactJS Web 界面。

成功安装后,打开您的 Web 浏览器并使用 URL 访问 ReactJS Web UI https://your-IP-address:3000. 您将被重定向到以下页面:

恭喜! 你已经成功安装了 ReactJS。 感谢您使用本教程在 Ubuntu 22.04 LTS Jammy Jellyfish 系统上安装 ReactJS。 如需更多帮助或有用信息,我们建议您查看 ReactJS 官方网站.