快速搭建最简单的前端项目vue+View UI Plus

ops/2024/11/10 15:29:26/

1 引言

‌‌Vue是一套用于构建Web前端界面的渐进式JavaScript框架。‌‌它以其易学易用、性能出色、灵活多变而深受开发者喜爱,并且与其他前端框架(如‌React和‌Angular)相比,在国内市场上受到了广泛的认可和使用。点击进入官方网站。
View UI Plus 是 View Design 设计体系中基于 Vue.js 3 的一套 UI 组件库,主要用于企业级中后台系统。提供了超过 80 个常用底层组件(如 Button、Input、DatePicker等)及业务组件(如 City、Auth、Login 等)。点击进入官方网站。

2 安装Visual Studio Code

Visual Studio Code是前端常用的开发工具,下载地址,下载后根据引导程序安装即可。
在这里插入图片描述

3 安装node.js

Node.js 是一个开源的、跨平台的 JavaScript 运行时环境。下载地址,下载后根据引导程序安装即可。
在这里插入图片描述安装完成后,打开CMD命令行,输入node -v和npm -v,若显示版本则安装成功。
在这里插入图片描述

4 下载vue项目

View UI Plus提供了基础工程,以此为基础开发,可以省去大量配置和调试环境的时间。点击进入 下载页面,下载后解压到任意位置。由于github有时打不开,可以点击CSDN站内下载,我特意上传了一个。
在这里插入图片描述
在这里插入图片描述

5 导入vue项目

打开Visual Studio Code,依次点击File>>Add Folder to Workspace…,然后选择解压后的文件夹,点击确认项目就导入成功了。
在这里插入图片描述

6 启动项目

6.1. 在项目上右键点击Open in Integrated Terminal,弹出命令行。, 6.2. 打开README.md,查看启动步骤。
在这里插入图片描述6.3. 命令行输入npm install,下载资源,等待下载完成。

  • 如果npm下载太慢,可以修改npm默认下载地址为国内淘宝的npm镜像服务器。在命令行输入npm config set registry https://registry.npmmirror.com/即可,然后关闭Visual Studio Code,重新打开执行npm install。

在这里插入图片描述

6.4. 命令行输入npm run serve,启动项目,等待启动完成。
在这里插入图片描述6.5. 访问:http://localhost:8080/,如下图,项目启动成功。
在这里插入图片描述


http://www.ppmy.cn/ops/113320.html

相关文章

Unity3D下如何播放RTSP流?

技术背景 在Unity3D中直接播放RTSP(Real Time Streaming Protocol)流并不直接支持,因为Unity的内置多媒体组件(如AudioSource和VideoPlayer)主要设计用于处理本地文件或HTTP流,而不直接支持RTSP。所以&…

在MAC中Ollama开放其他电脑访问

ollama安装完毕后默认只能在本地访问,之前我都是安装其他的软件之后可以结合开放其他端口访问,其实是可以新增或修改下电脑的系统配置,就可以打开端口允许除本机IP或localhost访问。 步骤如下: 1、查看端口(默认是&…

Kafka+PostgreSql,构建一个总线服务

之前开发的系统,用到了RabbitMQ和SQL Server作为总线服务的传输层和存储层,最近一直在看Kafka和PostgreSql相关的知识,想着是不是可以把服务总线的技术栈切换到这个上面。今天花了点时间试了试,过程还是比较顺利的,后续…

C++返回值优化(Return Value Optimization, RVO)与移动语义(Move Semantics)

在C编程中,返回值优化(Return Value Optimization, RVO)与移动语义(Move Semantics)是提高程序效率、减少不必要的对象复制的重要机制。 一、返回值优化(RVO) 基本概念 返回值优化是一种编译器…

Milvus - 构建向量数据库并进行相似度查询

向量相似度检索在大规模数据分析和机器学习应用中是一个非常关键的任务,特别是在处理文本、图像或其他嵌入向量时。Milvus 是一个高性能的开源向量数据库,专为存储和检索大规模向量数据设计。本文将介绍如何在 Docker 中安装 Milvus,并展示如…

GO主流开源框架

GO主流开源框架 Go 语言有着丰富的开源框架生态,涵盖了多种应用场景,如 Web 开发、数据库操作、微服务、日志处理等。以下是一些常见的 Go 框架及其典型作用场景: 1. Web 框架 Gin: 作用:一个高性能的轻量级 Web 框架&#xff…

今天不写项目,聊聊后端面试吧

首先感谢大家之前的观看呀~兄弟们~ 这边把我去过几家公司面试的题目都写一下哈,像我大二下,就是前两个月7-9进了公司进行后端实习,哎.....反正就是学学学..话不多说~ 1.Frist 1.HashMap实现原理 HashMap是基于哈希表的Map接口的非同步实现…

网站在线客服插件配置

使用工具:百度爱番番 下载地址: 百度爱番番—企业的一站式智能营销管家 一、下载百度爱番番APP,注册账号 二、 登录app 三、点击设置——站点设置——新建站点 四、设置站点名称——站点地址——PC站点——确定 五、点击配置好的站点的获取代…