脚手架工具的应用(前端和后端搭建)

前端

一、安装 Node.js 环境

使用npm下载镜像

查看镜像:npm config get registry

切换淘宝镜像:npm config set registry https://registry.npmmirror.com

还原镜像:npm config set registry https://registry.npmjs.org

二、使用 Vue.js 脚手架工具Vite

相比Vue CLI,Vite是一款更新的Vue.js脚手架工具。是下一代的前端工具链。

Vite本身并不像Vue CLI那样功能大而全,它只专注于提供基本构建的功能和开发服务器。因此Vite更加小巧迅捷,其开发服务器会比Vue CLI的开发服务器快10倍左右,这对开发者来说太重要了,开发服务器的响应速度直接会影响到开发者的编程体验和开发效率。对于非常大型的项目来说,可能会有成千上万个JavaScript模块,这时构建效率的速度差异就会非常明显。

创建Vite工程命令:npm create vite@latest

项目创建完之后,

cd到目标目录。然后npm install构建项目,最后npm run dev

这就是前端的目录结构。

后端

一、使用 Express 项目生成工具

基于 Node.js 平台,快速、开发、极简的 WEB 开发框架

首先需要安装一个脚手架工具来帮助创建Express项目。在终端执行如下指令来全局安装一个 Node.js 工具包:

npm install –g yo generator-express-no-stress-typescript

generator-express-no-stress-typescript是一款开源的适用于Express框架的脚手架工具,它会帮助我们生成一个集开发服务器、交互式文档、结构化日志等功能一体的Express项目。

创建一个Express下的 HelloWorld 项目:

yo express-no-stress-typescript 1-HelloWorld-backend

安装过程出现选项选默认,一路Enter过去就行

使用generator-express-no-stress-typescript脚手架会自动帮助我们生成API接口文档页面

接下来,cd到目标目录。然后npm install构建项目,最后npm run dev,后端就创建好了

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

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

相关文章

智能停车场管理小程序的设计

管理员账户功能包括:系统首页,个人中心,用户管理,车位信息管理,车位预订管理,系统管理 微信端账号功能包括:系统首页,地图,我的 开发系统:Windows 架构模式…

如何将开发工具设置成滚动鼠标改变字体大小

就在刚刚与温州那边技术开会,温州那边技术提出:字体太小,代码看不清,需要将字体放大。然后让我将IDE设置成按住键盘的Ctrl滚动鼠标,可以放大字体大小。。。顿时间的小小尴尬。下面我来记录一下究竟是怎么操作的&#x…

安装WMware和Ubuntu并使用xShell连接

0、我的电脑配置 设备名称 hello 处理器 Intel(R) Core(TM) i7-10700K CPU 3.80GHz 3.79 GHz 机带 RAM 16.0 GB (15.9 GB 可用) 设备 ID 541EC230-9910-418C-9043-5FBBF8ED320C 产品 ID 00330-80000-00000-AA846 系统类型 64 位操作系统, 基于 x64 的处理器 笔和触控 没有可…

汽车功能安全--TC3xx LBIST触发时机讨论

目录 1. LBIST架构 2. LBIST寄存器配置 3. LBIST触发时机 LBIST,全称Logic Built-in Self Test。 在TC3xx中,LBIST是一种硬件功能安全机制,目的是为了探测MCU内部逻辑电路的潜伏故障(latent faults)。 从使用者角度来看,只需…

K8S 1.31 新功能: 跨核分发CPU

​在Kubernetes的最新版本1.31中,一个超酷的新功能,叫做CPUManager的静态策略,里面有个选项叫做distribute-cpus-across-cores。虽然这个功能现在还在测试阶段,也就是alpha版,而且默认是藏起来的,但它的目的…

腾讯提出一种新的针对风格化角色和逼真服装动画的生成3D运动转移方法,生成效果逼真!

来自腾讯XR视觉实验室的研究团队提出了一种创新的3D运动转移方法,专门针对风格化角色和逼真服装动画的生成。该方法能够将源动作准确地映射到目标角色上,同时考虑了角色身体的刚性变形和服装的局部物理动态变形。 与现有技术相比,这技术不仅…

docker Desktop报错 error pulling image configuration 处理

问题描述 在 docker 拉数据 出现以下错误 error pulling image configurarion: 这个问题 主要是 可能应该某些原因不能网络无法连上镜像 原因分析: 1。 2024年 5月以后 国内很多IP都 。。。懂的都懂,很多 VPN 也是。。。 懂的都懂&#x…

C++类和对象(5)——运算符重载(以日期类为例)

运算符重载的作用 假设我们此时实现了日期类的运算符重载,我们就可以 实现如图的很多功能,完成日期计算器的底层代码。 运算符重载关键字 运算符重载的关键字是operator。 比如你想重载‘’运算符,那么语法格式就是 返回类型 operator …

算法设计与分析:实验三 回溯法——地图填色问题

实验内容与要求: 问题描述: 我们可以将地图转换为平面图,每个地区变成一个节点,相邻地区用边连接,我们要为这个图形的顶点着色,并且两个顶点通过边连接时必须具有不同的颜色。附件是给出的地图数据&#…

仿华为车机UI--图标从Workspace拖动到Hotseat同时保留图标在原来位置

基于Android13 Launcher3,原生系统如果把图标从Workspace拖动到Hotseat里则Workspace就没有了,需求是执行拖拽动作后,图标同时保留在原位置。 实现效果如下: 实现思路: 1.如果在workspace中拖动,则保留原来“改变图标…

Scratch教学案例-《三顾茅庐》:让编程学习如同故事般引人入胜

三顾茅庐-小虎鲸Scratch资源站 在编程的世界里,我们常常寻找那种既能激发创意,又能提升技能的学习方式。今天,小虎鲸Scratch资源站为您带来了一款独特的教学作品——《三顾茅庐》。这是一部将经典故事与编程教学巧妙结合的Scratch项目&#x…

在docker中安装skywalking + es

ES的版本和官网 es版本: Past Releases of Elastic Stack Software | Elastic es版本logstash版本JDK版本对应关系 支持一览表 | Elastic skywalking的版本说明和官网 Advanced deployment | Apache SkyWalking skywalking和es的对应关系,在网页的…

读书笔记:《深入理解Java虚拟机》(4)

垃圾收集器与内存分配策略 一、对象已死? 堆中几乎放着所有的对象实例,对堆垃圾回收前的第一步就是要判断哪些对象已经死亡(即不能再被任何途径使用的对象)。 引用计数法 给对象中添加一个引用计数器: 每当有一个…

day03-面向对象-内部类泛型常用API

一、内部类 内部类是类中的五大成分之一(成员变量、方法、构造器、代码块、内部类) 如果一个类定义在另一个类的内部,这个类就是内部类。 场景:当一个类的内部,包含了一个完整的事物,且这个事物没有必要单…

bitmap(位图)的使用

零存零取,整存零取,整存整取, 零存整取 bitmap介绍 位图不是真正的数据类型,它是定义在字符串类型中,一个字符串类型的值最多能存储512M字节的内容, 位上限:2^(9(512)10(1024)10(1024)3(8b1B))2^32b 语句操作: s…

[报错] nvcc -V 找不到

报错: nvcc : 无法将“nvcc”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,ObjectNotFound: (nvcc:String) [], CommandNotFoundExceptionFullyQualifiedErrorId : CommandNotFoundException 找不到 nvcc -V,试过…

鸿蒙(API 12 Beta5版)【通过文本生成码图】

基本概念 码图生成能力支持将字符串转换为自定义格式的码图。 场景介绍 码图生成能力支持将字符串转换为自定义格式的码图,包含条形码、二维码生成。 可以将字符串转成联系人码图,手机克隆码图,例如将"HUAWEI"字符串生成码图使…

深度学习系列71:表格检测和识别

1. pdf处理 如果是可编辑的pdf格式,那么可以直接用pdfplumber进行处理: import pdfplumber import pandas as pdwith pdfplumber.open("中新科技:2015年年度报告摘要.PDF") as pdf:page pdf.pages[1] # 第一页的信息text pag…

【开端】基于nginx部署的具有网关的web日志分析

一、绪论 基于nginx部署的具有网关的web日志分析,我们可以分析的日志有nginx的access.log ,网关的日志和应用的日志 二、日志分析 1、nginx日志 参数 说明 示例 $remote_addr 客户端地址 172.17.0.1 $remote_user 客户端用户名称 -- $time_lo…

Datawhale AI夏令营

一、物体检测算法 物体检测算法主要分为两类:One-Stage(一阶段)和Two-Stage(两阶段)模型。 二、One-Stage目标检测算法 定义:One-Stage目标检测算法是一种直接在图像上进行目标检测的方法,无…