【第7章】Vue之第一个Vue程序(Vue创建)

文章目录

  • 前言
  • 一、创建
    • 1. 命令行
    • 2. 创建
    • 3. 安装依赖
  • 二、启动
  • 三、访问
  • 总结


前言

接下来我们通过VSCode来创建我们的第一个Vue应用程序。


一、创建

1. 命令行

Terminal>New Terminal

2. 创建

#这一指令将会安装并执行 create-vue,它是 Vue 官方的项目脚手架工具。
npm create vue@latest

如果不确定是否要开启某个功能,你可以直接按下回车键选择 No。

在这里插入图片描述

创建完成后,就能看到新创建的工程已经出现在工作区

在这里插入图片描述

3. 安装依赖

cd <your-project-name>
npm install

在这里插入图片描述

二、启动

npm run dev

在这里插入图片描述

三、访问

http://localhost:5173/
在这里插入图片描述


总结

回到顶部
到这里,我们的第一个Vue程序就创建完成并成功启动了,是不是很简单。

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

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

相关文章

【Quartus 13.0】EP1C3144I7 部署4*6矩阵键盘

仿照 正点原子 的 Sample 修改 V2手册 P266 没有用这个 给出的手动按键控制的矩阵模块 为 4*6 矩阵键盘外接模块 每一个按键自带led&#xff0c;所以对应的接口是合并在一起的一个引脚 按下后 LED 亮&#xff0c;vice versa 底部 LED*8 目前不清楚有什么用 或许可以变成 16进…

人工智能在风险管理中的创新之路

随着科技的飞速发展&#xff0c;人工智能&#xff08;AI&#xff09;已经渗透到我们生活的方方面面&#xff0c;尤其在风险管理领域&#xff0c;其展现出的巨大潜力令人瞩目。风险管理&#xff0c;作为一个涉及广泛领域的复杂系统&#xff0c;正逐渐依赖于AI技术来提升效率和准…

Folx软件下载及安装教程

简介&#xff1a; Folx Pro是一款适合Mac的专业下载工具也是一款BT下载器&#xff0c;Folx中文版有一个支持Retina显示的现代界面&#xff0c;提供独特的系统排序、存储下载内容与预览下载文件。Folx中文官网提供Folx教程、激活码、下载。 安 装 包 获 取 地 址&#xff1a; …

漫谈中国历史:《米小圈漫画历史》带大家领略古今变迁

在漫画的世界里&#xff0c;历史可以是生动有趣的&#xff0c;就像《米小圈漫画历史》展现的那样。这一套以米小圈形象为主的原创幽默中国历史漫画书&#xff0c;不仅让读者在娱乐中学习&#xff0c;更是一次穿越历史长河的奇妙冒险。在这篇文章中&#xff0c;我们将跟随米小圈…

(游戏:挑一张牌)编写程序,模拟从一副 52 张的牌中选择一张牌。

(游戏:挑一张牌)编写程序&#xff0c;模拟从一副 52 张的牌中选择一张牌。程序应该显示牌的 大小(Ace、2、3、4、5、6、7、8、9、10、Jack、Queen、King)以及牌的花色(Clubs (黑梅花)、Diamonds(红方块)、Hearts(红心)、Spades(黑桃))。下面是这个程序的 运行示例: The card yo…

Stable Diffusion【光影文字】:绚丽光影,文字与城市夜景的光影之约

今天我们我们结合城市夜景背景来看一下光影文字的效果&#xff0c;我们先来看一下效果图。 一. 字融城市夜景制作光影文字方法 【第一步】&#xff1a;制作底图这里制作底图使用黑底白字。我们使用美图秀秀制作一个"小梁子"字的底图。 字体&#xff1a;默认字体 图…

【数据挖掘】机器学习中相似性度量方法-欧式距离

写在前面&#xff1a; 首先感谢兄弟们的订阅&#xff0c;让我有创作的动力&#xff0c;在创作过程我会尽最大能力&#xff0c;保证作品的质量&#xff0c;如果有问题&#xff0c;可以私信我&#xff0c;让我们携手共进&#xff0c;共创辉煌。 路虽远&#xff0c;行则将至&#…

换卡槽=停机?新手机号使用指南!

刚办理的手机号莫名其妙的就被停用了&#xff1f;这到底是怎么回事&#xff1f;这篇文章快来学习一下吧。 ​ 先说一下&#xff0c;你的手机为什么被停机&#xff1f; 现在运营商对于手机卡的使用有着非常严格的要求&#xff0c;尤其是刚办理的新号码&#xff0c;更是“严上加…

用Rust手把手编写一个Proxy(代理), 开始动工

https://shop.kongfz.com/795263/ 代理端和代理服务端之间可用自有格式来实现多路复用以减少连接的建立断开的开销,目前暂未实现代理服务端。 类结构 proxy.rs 负责代理结构的存储,监听类型,监听地址,是否有父级地址,认证账号密码等。 flag.rs 监听类型的二进制结构,…

Java核心(四)反射

这篇内容叫反射也不够准确&#xff0c;其实它更像是java类加载的一个延申。 Java类加载过程 之前解释过一个Java的类的加载过程&#xff0c;现在回顾一下类的加载&#xff1a; 类的加载指的是将类的字节码文件&#xff08;.class文件&#xff09;中数据读入到内存中&#xff…

【单片机毕业设计选题24007】-基于STM32和阿里云的家庭健康数据监测系统

系统功能: 本课题设计是基于STM32单片机作为控制主体&#xff0c;通过HX711称重模块&#xff0c;HC-SR04超声波测距模块&#xff0c;红外测温&#xff0c;心率传感器等模块通过I2C或SPI接口与STM32进行通信&#xff0c;并读取传感器输出的身高&#xff0c;体重&#xff0c;心率…

ubuntu的内核离线升级

服务器爆出Linux kernel权限提升漏洞&#xff0c;所以需要升级内核。所以我记录一下升级内核的过程。 因为有权限漏洞&#xff0c;所以升级全程离线断网。 一 下载 先下载内核升级文件&#xff0c;打算升级的目标是6.1.76版本 Index of /mainline/v6.1.76/amd64 下载完毕后传…

如何保护云主机安全

在数字化时代&#xff0c;云服务器已成为企业数据存储、处理和传输的重要工具。然而&#xff0c;随着其应用的广泛和深入&#xff0c;云服务器也面临着越来越多的安全威胁。为了应对这些威胁&#xff0c;白名单技术应运而生&#xff0c;成为保护云服务器安全的重要手段。 首先&…

通信设备的网卡

一、网卡的作用 将计算机或者路由器连接到传输介质上的接口&#xff0c;传输介质可以是有线也可以是无线的。 &#xff08;1&#xff09;计算机的网卡 现在的计算机大多有两个网卡&#xff0c;一个是有线网卡一个无线网卡&#xff0c;比如以我们的台式电脑为例 台式电脑千兆网…

SQL Server Management Studio (SSMS) 20.1 - 微软数据库管理工具

SQL Server Management Studio (SSMS) 20.1 - 微软数据库管理工具 请访问原文链接&#xff1a;https://sysin.org/blog/ssms/&#xff0c;查看最新版。原创作品&#xff0c;转载请保留出处。 作者主页&#xff1a;sysin.org 笔者注&#xff1a;SQL Server 2014 及之前版本内置…

【Kafka】Kafka生产者-04

【Kafka】Kafka生产者-04 1. 生产者发送消息流程1.1 发送原理 2. 相关文档 1. 生产者发送消息流程 1.1 发送原理 在消息发送的过程中&#xff0c;涉及到了两个线程——main 线程和 Sender 线程。 在 main 线程中创建了一个双端队列 RecordAccumulator。 main 线程将消息发送给…

canvas学习

Canvas API 提供了一个通过 JavaScript 和 HTML 的 元素来绘制图形的方式。它可以用于动画、游戏画面、数据可视化、图片编辑以及实时视频处理等方面。 Canvas 的基本用法 <canvas> 元素 <canvas id"tutorial" width"150" height"150&quo…

【计算机网络仿真实验-实验2.4、2.5】静态路由、动态路由(RIP)

实验2.4 静态路由 1. 实验拓扑图 注意&#xff1a;有些同学不知道两个路由器之间如何用串行DCE(红线)相接&#xff0c;只需要为路由器分别增加新的HWIC-2T接口卡就好了 不知道如何添加物理接口的&#xff0c;可以查看本人计算机网络专栏中【计算机网络仿真实验——实验准备】…

Java面向对象-抽象类和抽象方法

Java面向对象-抽象类和抽象方法 1、代码案例展示2、抽象类和抽象方法的关系&#xff1a; 1、代码案例展示 1、在一个类中会有一类方法&#xff0c;无需重写&#xff0c;直接使用 2、在一个类中会有一类方法&#xff0c;会对这个方法进行重写 3、一个方法的方法体去掉&#xff…

QT打包(windows linux)封包 完整图文版

目录 简介: 一. for windows 1.首先下载组件 2.开始构建Release版本. 3.然后点击构建 4.在文件夹内直接点击exe文件,会报下面的错误,因为缺少dll连接; 5.需要把这个exe单独复制到一个文件夹内, 6.先cd到单独exe所在的文件夹; cd 文件路径 7.然后运行 windeployqt 文…