828华为云征文|云服务器Flexus X实例|MacOS系统-宝塔部署Nuxt项目

news2024/11/16 11:35:53

文章目录

  • 1. Flexus云服务器X实例
    • 1.1 与Flexus应用服务器L实例相比具备以下优势
    • 1.2 服务器的详细配置
  • 2.宝塔部署Nuxt项目
    • 2.1 登录实例
    • 2.1 宝塔面板
  • 3. Nuxt 项目与部署
    • 3.1 Nuxt
    • 3.2创建Nuxt项目
    • 3.3 部署
    • 3.4 部署成功
  • 4.结语


1. Flexus云服务器X实例

华为云的Flexus云服务是为中小企业和开发者设计的新一代云服务产品,它以高性价比和即开即用的特点,提供了卓越的用户体验。Flexus云服务器X实例是该服务系列中的一员,专为中低负载场景设计,如电商直播、企业网站搭建、开发测试环境、游戏服务器和音视频服务等。

1.1 与Flexus应用服务器L实例相比具备以下优势

  • 丰富的公共镜像:提供多种操作系统和应用环境,满足不同开发和部署需求。
  • 灵活的资源配置:用户可以根据实际需求,自定义虚拟CPU(vCPU)和内存的配比,实现资源的最优利用。
  • 智能动态调整:能够根据业务负载智能调整资源分配,实现在不同负载情况下的自动升降配,提高资源利用率。
  • 更广泛的负载适应性:相较于L实例,X实例能够适应更广泛的业务负载范围,提供更加稳定和高效的服务。

这里已经事先选购了一台服务器 Flexus X实例,在华为云828 B2B企业节期间,Flexus X实例正推出大力度促销活动,欢迎各位到官网了解。华为云828活动页面。千万不要错过这次机会。

接着,我们进入 Flexus X实例列表。
在这里插入图片描述

1.2 服务器的详细配置

查看我们配置的云服务
在这里插入图片描述

2.宝塔部署Nuxt项目

2.1 登录实例

我们通过CloudShell 来登录,十分方便快捷。
在这里插入图片描述
在这里插入图片描述

2.1 宝塔面板

之前我们事先在服务器Flexus X实例,搭建了宝塔面板。这里我们查看地址。
在这里插入图片描述
选择14 查看面板信息,初始密码首次登录的时候已经获取
在这里插入图片描述这里我们登录一下。
在这里插入图片描述
进入宝塔面板,由于我们要部署前端项目,所以需要用的nginx服务器 ,这里我们安装下。
在这里插入图片描述
接着我们选择极速安装,操作起来还是简单快捷的。
在这里插入图片描述
等待安装任务进行
在这里插入图片描述
安装成功后我们可以在任务列表中查看安装状态。这里2个安装任务都安装成功了。
在这里插入图片描述
紧接着,我们再一次进入宝塔面板,进入“网站”菜单,这次可以正常添加站点了。
在这里插入图片描述
添加网站成功。
在这里插入图片描述
我们在浏览器打开,出现下面页面,表示我们部署成功了。接下来就是要替换成nuxt项目文件。
在这里插入图片描述

3. Nuxt 项目与部署

3.1 Nuxt

Nuxt.js 是一个基于 Vue.js 的更高层次的框架,它提供了一种更简单的方式来构建服务器端渲染(SSR)、静态生成的应用程序以及单页应用(SPA)。Nuxt.js 通过一系列约定和自动化工具简化了 Vue 应用的开发流程,使得开发者可以更加专注于业务逻辑而非配置。
在这里插入图片描述

3.2创建Nuxt项目

接着,我们查看到安装文档特别提到的先决条件:
在这里插入图片描述

那么按照文档安装条件,首先进行npx-v查看是否安装,nvxt的安装需要node版本比较高,一开始我v14.16.0 ,提示版本过低,于是我用nvm工具切换到高版本 v18.20.0.
在这里插入图片描述
安装成功后,我们运行起我们的项目。
在这里插入图片描述
运行成功后,我们可以看到默认欢迎页。
在这里插入图片描述

3.3 部署

nuxt提供了几种部署方式,这里我们采用下面一种,打包构建后可以部署到任何静态托管服务器上
在这里插入图片描述
跟着教程执行npx nuxi generate
在这里插入图片描述
执行成功后默认是在.output/public 目录,这里提一嘴,MacOS系统中,默认情况下,以点(.)开头的文件和文件夹是隐藏的。如果需要查看这些隐藏文件,我们可以使用以下方法:
在 shell 执行一下命令

defaults write com.apple.finder AppleShowAllFiles -bool true

然后重启 Finder 使更改生效:

killall Finder

接着我们在宝塔面板文件菜单上传我们上面打包好的文件。

在这里插入图片描述
这里选择上传的时候, 点开头的文件还是看不到,于是我改了下文件名。outputF ,然后选择public文件
在这里插入图片描述
接着点击继续上传
在这里插入图片描述
上传完成后,我们回到“网站”修改网站目录地址
在这里插入图片描述

3.4 部署成功

我们刷站点地址,就可以成功看到部署的内容。至此在云服务器Flexus X实例,基于宝塔部署Nuxt项目成功!!
在这里插入图片描述

4.结语

基于云服务器Flexus X实例,部署Nuxt项目的过程很顺利,选择华为云服务器,意味着您将获得一个稳定而高效的云计算环境。想要购买服务器的同学可以关注下这次华为云828活动,趁着活动优惠挑选自己心仪的服务器!
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2155792.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

股指期权交易详细基础介绍

股指期权是期权市场中的一种特定类型,其标的资产为股票指数。简而言之,它允许投资者在未来某个特定时间,以预先约定的价格,买入或卖出股票指数的权利。在中国,已上市的股指期权包括上证50、沪深300和中证1000股指期权&…

【C++ Primer Plus习题】17.5

大家好,这里是国中之林! ❥前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站。有兴趣的可以点点进去看看← 问题: 解答: #include <iostream> #include <fstream> #include <…

数据库系统基础概述

文章目录 前言一、数据库基础概念 1.数据库系统的组成2.数据模型3.数据库的体系结构二、MySQL数据库 1.了解MySQL2.MySQL的特性3.MySQL的应用场景总结 前言 MySQL数据库是一款完全免费的产品&#xff0c;用户可以直接从网上下载使用&#xff0c;不用花费任何费用。这点对于初学…

react开发环境搭建

文章目录 准备工作创建 React 项目使用 create-react-app 创建 React 项目使用 Vite 创建 React 项目启动项目效果安装出现的情况 react项目文件讲解1. 项目根目录2. 其他可能的目录和文件3. 配置文件 准备工作 Node.js 安装方法&#xff1a; 方式一&#xff1a;使用 NVM 安装…

制作一个rabbitmq-sdk以及rabbitmq消费者实现定时上下线功能

目录结构 pom.xml <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation"http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">&l…

力扣中等 33.搜索旋转排序数组

文章目录 题目介绍题解 题目介绍 题解 首先用 153. 寻找旋转排序数组中的最小值 的方法&#xff0c;找到 nums 的最小值的下标 i。 然后分类讨论&#xff1a; 如果 target>nums[n−1]&#xff0c;在 [0,i−1] 中二分查找 target。 如果 target≤nums[n−1]&#xff0c;那…

利士策分享,家庭内耗:隐形的风暴,无声的侵蚀

利士策分享&#xff0c;家庭内耗&#xff1a;隐形的风暴&#xff0c;无声的侵蚀 在温馨的灯光下&#xff0c;家本应是我们心灵的港湾&#xff0c;是疲惫时最坚实的依靠。 然而&#xff0c;当家庭内部出现裂痕&#xff0c;无形的内耗便如同冬日里的寒风&#xff0c;悄无声息地…

11年408考研真题解析-计算机网络

第一题&#xff1a; 解析&#xff1a;网络层虚电路服务和数据报服务 传输服务只有&#xff1a;有连接可靠和无连接不可靠两种&#xff0c;直接排除BC。 网络层指的是IP协议&#xff0c;由图二可知&#xff1a;运输层&#xff0c;网际层&#xff0c;网络接口层唯一有连接可靠的协…

Spark MLlib实践指南:从大数据推荐系统到客户流失预测的全流程建模

问题一 背景&#xff1a; 本题目基于用户数据&#xff0c;将据数据切分为训练集和验证集&#xff0c;供建模使用。训练集与测试集切分比例为8:2。 数据说明&#xff1a; capter5_2ml.csv中每列数据分别为userId , movieId , rating , timestamp。 数据&#xff1a; capte…

详解 Linux 系统下的进程(下)

目录 一.进程控制 1.进程创建 a.Linux 系统中&#xff0c;如何创建一个进程&#xff1f; b.进程创建成功后&#xff0c;Linux 底层会为其做些什么&#xff1f; 2.进程终止 a.什么是进程终止&#xff1f; b.进程终止的方法有哪些&#xff1f; c.exit 与 _exit的区别 3.…

通过logstash同步elasticsearch数据

1 概述 logstash是一个对数据进行抽取、转换、输出的工具&#xff0c;能对接多种数据源和目标数据。本文介绍通过它来同步elasticsearch的数据。 2 环境 实验仅仅需要一台logstash机器和两台elasticsearch机器&#xff08;elasticsearch v7.1.0&#xff09;。本文用docker来模…

NLP 序列标注任务核心梳理

句向量标注 用 bert 生成句向量用 lstm 或 bert 承接 bert 的输出&#xff0c;保证模型可以学习到内容的连续性。此时 lstm 输入形状为&#xff1a; pooled_output.unsqueeze(0) (1, num_sentence, vector_size) 应用场景 词性标注句法分析 文本加标点 相当于粗粒度的分词任…

实时同步 解决存储问题 sersync

目录 1.sersync服务 2.sersync同步整体架构 ​编辑 3.rsync服务准备 4.sersync部署使用 5.修改配置文件 6.启动sersync 7.接入nfs服务 8.联调测试 1.sersync服务 sersync服务其实就是由两个服务组成一个是inotify服务和rsync服务组成 inotify服务用来监控那个…

Linux 文件系统(上)

目录 一.预备阶段 1.认识文件 2.OS对内存文件的管理 3.C库函数和系统调用接口 a.C库函数——fopen b.系统调用接口——open 二.理解文件描述符 1.一张图&#xff0c;详解文件描述符的由来 2.fd的分配规则 3.从fd的角度理解FILE 三.重定向和缓冲区 1.前置知识——理解…

网络安全-CSRF

一、环境 DVWA网上找 二、简单介绍 这个漏洞很早之前了&#xff0c;但是为了避免大家在面试等等的时候被问到&#xff0c;这里给大家温习一下 CSRF全程是没有黑客参与的&#xff0c;全程都是用户自己在操作 三、环境演练 这个是DVWA的提交表单页面&#xff0c;我这里伪造…

【2020工业图像异常检测文献】PaDiM

PaDiM: a Patch Distribution Modeling Framework for Anomaly Detection and Localization 1、Background 在单类学习&#xff08;仅使用正常数据&#xff08;即“单一类”&#xff09;来训练模型&#xff09;环境中的异常检测和定位任务方法中&#xff0c;要么需要深度神经网…

结合HashMap与Java 8的Function和Optional消除ifelse判断

shigen坚持更新文章的博客写手&#xff0c;记录成长&#xff0c;分享认知&#xff0c;留住感动。个人IP&#xff1a;shigen 在文章的开头我们先从这些场景进入本期的问题&#xff1a; 业务代码中各种if-else有遇到过吗&#xff0c;有什么好的优化方式&#xff1b;java8出来这么…

鸿蒙开发(NEXT/API 12)【跨设备互通特性简介】协同服务

跨设备互通提供跨设备的相机、扫描、图库访问能力&#xff0c;平板或2in1设备可以调用手机的相机、扫描、图库等功能。 说明 本章节以拍照为例展开介绍&#xff0c;扫描、图库功能的使用与拍照类似。 用户在平板或2in1设备上使用富文本类编辑应用&#xff08;如&#xff1a;…

学习 git 命令行的简单操作, 能够将代码上传到 Gitee 上

首先登录自己的gitee并创建好仓库 将仓库与Linux终端做链接 比如说我这里已经创建好了一个我的Linux学习仓库 点开克隆/下载&#xff1a; 在你的终端中粘贴上图中1中的指令 此时他会让你输入你的用户名和密码&#xff0c;用户名就是上图中3中Username for ....中后面你的一个…

预付费计量系统实体模型

1. 预付费计量系统实体模型 A generic entity model for electricity payment metering systems is shown in Figure 2. Although it provides a limited perspective, it does serve to convey certain essential concepts. 关于电子式预付费电表系统的实体模型见图 2…