如何在 Ubuntu 22.04 上安装 Vue.JS
Vue.js 是一个 JavaScript 框架,用于创建交互式用户界面和单页应用程序。 它比 AngularJS 框架更轻、适应性更强。 它简单、灵活、模块化、高性能、易于学习,并提供许多促进应用程序开发的工具和库。 如果您了解基本的 HTML、CSS 和 JavaScript,则可以快速开始使用 Vue.js 构建 Web 应用程序。
本指南将向您展示如何在 Ubuntu 22.04 上安装 Vue JS。
先决条件
- 运行 Ubuntu 22.04 的 HAProxy 服务器。
- 所有服务器上都配置了 root 密码。
安装 Node.js
在开始之前,您需要在服务器上安装 Node.js。 默认情况下,最新版本的 Node.js 不包含在 Ubuntu 22.04 默认存储库中。 因此,您需要从 Node 源存储库安装它。
首先,使用以下命令安装所需的依赖项:
apt install curl gnupg2 gnupg git wget -y
接下来,使用以下命令添加 Node 源存储库:
curl -fsSL https://deb.nodesource.com/setup_lts.x | bash -
添加存储库后,您可以使用以下命令安装 Node.js:
apt install nodejs -y
安装 Node.js 后,您可以使用以下命令验证 Node.js 版本:
node --version
您将得到以下输出:
v16.16.0
现在,使用以下命令将 NPM 更新到最新版本:
npm install npm@latest -g
您还可以使用以下命令验证 NPM 版本:
npm --version
您应该得到以下输出:
8.13.2
安装 Vue CLI
现在,您可以使用以下命令使用 NPM 安装 Vue CLI 软件包:
npm install -g @vue/cli
安装 Vue 后,您可以使用以下命令验证 Vue JS 版本:
vue --version
您应该看到以下输出:
@vue/cli 5.0.8
使用 Vue JS 创建一个简单的应用程序
您现在可以使用 Vue CLI 轻松创建您的应用程序。 运行以下命令创建名为 myapp 的示例应用程序。
vue create myapp
您将得到以下输出:
Vue CLI v5.0.8 ? Creating project in /root/myapp. ???? Initializing git repository... ?? Installing CLI plugins. This might take a while... added 848 packages, and audited 849 packages in 24s 88 packages are looking for funding run `npm fund` for details found 0 vulnerabilities ???? Invoking generators... ???? Installing additional dependencies... added 95 packages, and audited 944 packages in 6s 98 packages are looking for funding run `npm fund` for details found 0 vulnerabilities ? Running completion hooks... ???? Generating README.md... ???? Successfully created project myapp. ???? Get started with the following commands: $cd myapp $npm run serve WARN Skipped git commit due to missing username and email in git config, or failed to sign commit. You will need to perform the initial commit yourself.
接下来,将目录更改为 myapp 并使用以下命令列出所有已安装的文件和目录:
cd myapp
ls
您将得到以下输出:
babel.config.js jsconfig.json node_modules package.json package-lock.json public README.md src vue.config.js
启动 Vue JS 应用程序
现在,您可以通过运行以下命令来启动 Vue JS 应用程序:
npm run serve
应用程序启动后,您将得到以下输出:
> [email protected] serve > vue-cli-service serve INFO Starting development server... DONE Compiled successfully in 6469ms 8:45:33 AM App running at: - Local: http://localhost:8080/ - Network: unavailable Note that the development build is not optimized. To create a production build, run npm run build.
访问 Vue JS Web 界面
此时,Vue JS 应用程序已安装并侦听端口 8080。您现在可以打开 Web 浏览器并使用 URL http://your-serevr-ip 访问 Vue JS 应用程序。 您应该在以下页面上看到 Vue JS 仪表板:
结论
在这篇文章中,我们解释了如何在 Ubuntu 22.04 上安装 Vue JS。 您现在可以开始使用 Vue JS 框架构建单页应用程序。 如果您有任何疑问,请随时问我。
资讯来源:由a0资讯编译自THECOINREPUBLIC。版权归作者A0资讯所有,未经许可,不得转载