Vue 环境安装以及项目创建

环境安装

nodejs 安装

下载地址:https://nodejs.org/dist/v18.16.1/
根据系统类型选择对应安装包,选择安装路径那个后一直下一步即可安装完成。
配置npm 代理镜像,设置为淘宝的镜像地址(后面按照依赖可以加速下载安装包)

npm config set registry https://registry.npmmirror.com

安装cnpm (可选)

npm install -g cnpm --registry=https://registry.npmmirror.com

查看是否安装成功
在这里插入图片描述

项目创建并启动

cmd 进入需要创建vue工程的目录下,输入如下命令并执行

npm init vue@latest

在这里插入图片描述
第一次我们可以在输入项目名称后其他选项都默认选择否(项目名称都使用小写字母)
然后执行提示命令进行启动:

  cd vue-base  进入到vue工程根目录下
  npm install  安装工程所需要的依赖
  npm run dev  启动vue工程

在这里插入图片描述

到这里项目启动完成,浏览器访问 http://localhost:5173/ 即可打开vue项目页面
这里的VITE 为vue的一个脚手架工具,在vue早前一些版本 使用的为webpacke脚手架工具。
在这里插入图片描述

项目目录

在这里插入图片描述

.idea 										--- 开发工具的配置文件夹(默认创建出来的为 .vscode)
node_modules 						--- Vue项目的运行依赖文件夹
public										--- 资源文件夹(如包含浏览器图标)
src											---源码文件夹
.gitignore									---git忽略文件
index.html								---入口HTML
package.json							---信息描述文件
README.md							---项目介绍文件
vite.config.js							---Vue配置文件

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Java介绍

计算机语言历史 1、软件的分类 软件从架构上分类: C/S(Client/Server):基于客户端和服务器 B/S(Browser/Server):基于浏览器和服务器 如何区分:如果使用时要安装则为C/S架构的,如果使用时用浏览器打开则为B/S架构 由于…

RDMA技术在Apache Spark中的应用

背景介绍 在当今数据驱动的时代,Apache Spark已经成为了处理大规模数据集的首选框架。作为一个开源的分布式计算系统,Spark因其高效的大数据处理能力而在各行各业中广受欢迎。无论是金融服务、电信、零售、医疗保健还是物联网,Spark的应用几…

共同学习|Spring Cloud Alibaba一一sentinel介绍

Sentinel介绍 介绍 alibaba/Sentinel Wiki GitHub 1、Sentinel是什么 随着微服务的流行,服务和服务之间的稳定性变得越来越重要。Sentinel以流量为切入点,从流量控制、熔断降级、系统负载保护等多个维度保护服务的稳定性。 Sentinel 具有以下特征&a…

集合详解-迭代器遍历-增强for-List集合-List五种遍历方式-Set集合-排序规则Comparable-双列集合

Collection集合 数组和集合的区别 相同点 都是容器,可以存储多个数据 不同点 数组的长度是不可变的,集合的长度是可变的 数组可以存基本数据类型和引用数据类型 集合只能存引用数据类型,如果要存基本数据类型,需要存对应的包装类 Collection 集合概述和使用 Collection…

安全评估与安全评价:区分核心概念

在当今信息化社会中,保护数据和网络安全变得尤为重要。为了确保系统和组织的安全,我们需要了解并正确运用安全评估和安全评价这两个核心概念。虽然它们听起来相似,但其实它们有着不同的定义和目的。 首先,安全评估是一种系统性的…

【Github】如何在Github上找到zotero插件的下载位置

最近博主在使用zotero时需要从github上下载一个插件,通过链接跳转到Github对应的用户下,可是还是花了一些时间才找到插件的具体位置,这里将我的经历分享给大家。 1、跳转到Github对应的用户下。 博主需要下载zotero中的中文文献识别插件Jas…

Adobe Acrobat DC中如何合并pdf并生成目录

一、利用 Acrobat 合成pdf目录 (一)新建标签(更改标签等级等) 1,用Adobe acrobat 软件打开待添加书签的pdf文档。 2,打开之后点击软件左边栏的书签(有时被隐藏了,点击一下界面左边…

通过elementUI学习vue

<template><el-radio v-model"radio" label"1">备选项</el-radio><el-radio v-model"radio" label"2">备选项</el-radio> </template><script>export default {data () {return {radio: 1}…

Phoncent博客:探索AI写作与编程的无限可能

Phoncent博客&#xff0c;一个名为Phoncent的创新AIGC博客网站&#xff0c;于2023年诞生。它的创始人是庄泽峰&#xff0c;一个自媒体人和个人站长&#xff0c;他在网络营销推广领域有着丰富的经验。庄泽峰深知人工智能技术在内容创作和编程领域的潜力和创造力&#xff0c;因此…

【全志D1-H 哪吒开发板】Debian系统安装调教和点灯指南

全志D1-H开发板【哪吒】使用Deabian系统入门 特别说明&#xff1a; 因为涉及到操作较多&#xff0c;博文可能会导致格式丢失 其中内容&#xff0c;会根据后续使用做优化调整 目录&#xff1a; 参考资料固件烧录启动调教点灯问题 〇、参考资料 官方资料 开发板-D1开发板【…

面试笔记系列六之redis+kafka+zookeeper基础知识点整理及常见面试题

Redis redis持久化机制&#xff1a;RDB和AOF Redis 持久化 Redis 提供了不同级别的持久化方式: RDB持久化方式能够在指定的时间间隔能对你的数据进行快照存储. AOF持久化方式记录每次对服务器写的操作,当服务器重启的时候会重新执行这些命令来恢复原始的数据,AOF命令以redi…

如何在aws服务器上部署mysql

在AWS服务器上部署 MySQL 数据库可以通过以下步骤完成&#xff1a; 启动 EC2 实例&#xff1a; 在 AWS 控制台中启动一个 EC2 实例&#xff0c;选择适合你需求的实例类型和配置。 安全组配置&#xff1a; 确保你的 EC2 实例的安全组配置允许来自你的 IP 地址的 MySQL 连接。默…

iOS中卡顿产生的主要原因及优化思路

卡顿本质上是一个UI体验上的问题&#xff0c;而UI的渲染及显示&#xff0c;主要涉及CPU和GPU两个层面。若 CPUGPU渲染耗时超过16.7ms&#xff0c;就会在屏幕vsync信号到来时无法更新屏幕内容&#xff0c;进而导致卡顿。 iOS中UI渲染主要包含Layout->Draw->Prepare->Co…

动态住宅IP vs 静态住宅IP,如何选择适合你的海外住宅IP?

随着数字时代的发展&#xff0c;网络已经成为了我们日常生活中不可或缺的一部分。在海外留学、旅游、工作或者进行电子商务等活动时&#xff0c;一个合适的住宅IP可以帮助我们保护个人隐私、确保网络连接的稳定性、提高在线服务的可靠性等。因此&#xff0c;选择适合自己的住宅…

“集世界精华·展中国风采”2024北京智能科技展会(世亚智博会)

在科技的浪潮中&#xff0c;中国犹如一艘乘风破浪的巨轮&#xff0c;稳健地航行在广阔的海洋上。随着科技的飞速发展&#xff0c;中国正逐渐成为全球科技领域的一面旗帜&#xff0c;引领着世界科技潮流。在这个伟大的时代&#xff0c;中国以卓越的科技创新能力和前瞻的战略视野…

JVM相关工具【jps、jstat、jinfo、jmap、jhat、jstack、VisualVM、GCEasy、MAT、GCViewer、Arthas】

JVM相关工具 JDK工具包jpsjstatjinfojmapjhatjstackVisualVM 第三方工具【GCEasy、MAT、GCViewer、Arthas】 转自 《极客时间》 JDK工具包 jps jstat jinfo jmap jhat jstack VisualVM 第三方工具【GCEasy、MAT、GCViewer、Arthas】

QT多语言切换功能

一.目的 在做项目时&#xff0c;有时希望我们的程序可以在不同的国家使用&#xff0c;这样最好的方式是一套程序能适应于多国语言。 Qt提供了这样的功能&#xff0c;使得一套程序可以呈现出不同的语言界面。本文将介绍QT如何实现多语言&#xff0c;以中文和英文为例。 QT开发…

数仓模型设计方法论

在当今大数据时代&#xff0c;数据已经成为企业最重要的资产之一。而数据仓库作为企业数据管理和分析的核心基础设施&#xff0c;其设计方法论对于企业的数据治理和决策分析至关重要。本文将探索数仓模型设计的方法论&#xff0c;帮助读者更好地理解和应用数仓模型设计。 一、…

2024最新Android面试题目,【设计思想解读开源框架】

前言 从18年毕业至今&#xff0c;就职过两家公司&#xff0c;大大小小项目做了几个&#xff0c;非常感谢我的两位老大&#xff0c;在我的android成长路上给予我很多指导&#xff0c;亦师亦友的关系。 从年前至今参加面试了很多公司&#xff0c;也收到了几家巨头的offer&#…

Open CASCADE学习|曲线和曲面上的标架

曲线和曲面上的标架&#xff08;Frame&#xff09;是微分几何中的重要概念&#xff0c;用于描述曲线或曲面在一点处的几何性质。这些标架通常由一组正交单位向量组成&#xff0c;这些向量与曲线或曲面的切线、法线和副法线等方向有关。 对于曲线&#xff0c;常见的标架是Frene…