npm创建Vue3项目

npm创建Vue3项目

  • 1 创建Vue项目
    • 说明
  • 2 安装
  • 3 运行

1 创建Vue项目

创建最新版的Vue项目,已经不推荐使用CLI构建方式了。参考如下即可。

npm create vue@latest

如果发现一直动不了,切换网络试一下,个人热点尝试一下。

按下图的选项按需引入自己需要的功能:
在这里插入图片描述

说明

选项说明
TypeScript 语法TypeScript 是一种由 Microsoft 开发的开源编程语言,它是 JavaScript 的超集,可以编译为纯 JavaScript。就是一种编程语言。
JSX 支持JSX 是一种 JavaScript 的语法扩展,通常用于构建 React 应用程序的用户界面。JSX 允许开发者在 JavaScript 中直接编写类似 HTML 的标记语法,使得编写和管理复杂的用户界面变得更加简单和直观。const element = \<div>Hello, World!\</div>;
Vue RouterVue Router 是 Vue.js 官方提供的路由管理器,用于构建单页面应用程序(SPA)。它允许你在 Vue.js 应用程序中实现基于 URL 的导航,并且能够以声明式的方式定义应用程序的路由映射关系。多组件开发选上,就是对页面每个部分解耦,可以按需导入。比如组成页面的nav、main、footer等分开开发。
PiniaPinia 是一个用于 Vue.js 的状态管理库,它专注于提供简单、轻量级且可扩展的状态管理解决方案。Pinia 提供了一种基于 Vue 3 的响应式 API 构建状态管理的方式,与 Vuex 相比,Pinia 更加灵活,并且在性能上有一些优势。在小型的Vue项目中,使用Vuex便足以,选否默认使用Vuex
VitestVitest 是一个用于 Vue.js 应用程序的测试运行器,它专注于提供简单、快速和可扩展的测试解决方案。Vitest 基于 Vite 构建,并且支持 Vue 3 和 Vue 2,能够帮助开发者在项目中进行单元测试和端到端测试。
端到端(End-to-End)测试在 Vue.js 项目中进行端到端(End-to-End)测试时,常用的工具包括 Cypress、Puppeteer、TestCafe 等。这些工具都能帮助你编写和执行端到端测试,并生成详细的测试报告
ESLintESLint 是一个开源的 JavaScript 代码检查工具,用于检查代码中的潜在问题、风格错误和代码质量问题。它可以帮助开发团队规范代码风格、发现潜在的错误,并提高代码的质量和可读性。

2 安装

npm install

在这里插入图片描述

3 运行

npm run dev

在这里插入图片描述

部署命令说明
npm run dev通常用于启动开发环境下的服务器或者构建工具。npm run dev 命令用于启动开发服务器,例如 webpack-dev-server、Vue CLI 的开发服务器等。npm run dev 可能会执行诸如编译、热重载、自动刷新等开发相关的任务,以提供一个方便的开发环境,使开发人员能够实时预览和调试项目。
npm run build用于构建项目的生产版本,生成用于部署的静态文件。当项目开发完成后,通常需要将项目打包成静态文件,以便部署到生产环境中。npm run build 命令会执行项目的构建过程,包括编译、压缩、打包等操作,最终生成用于生产环境的静态文件。

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

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

相关文章

Nacos快速入门(windows)

Nacos是 Dynamic Naming and Configuration Service的简称。Nacos能快速实现动态服务发现、服务配置、服务元数据及流量管理 下载启动Nacos Nacos下载启动&#xff08;windows&#xff09; 以下两种随意选择一种即可从github上下载源码方式启动 git clone https://github.com…

【pycharm】在debug循环时,如何快速debug到指定循环次数

【pycharm】在debug循环时&#xff0c;如何快速debug到指定循环次数 【先赞后看养成习惯】求关注收藏点赞&#x1f600; 在 PyCharm 中&#xff0c;可以使用条件断点来实现在特定循环次数后停止调试。这可以通过在断点处右键单击&#xff0c;然后选择 “Add Breakpoint” -&g…

Jenkins+AWS CodeCommit(git)

问题 需要使用Jenkins搭建一套CI流&#xff0c;即通过git代码托管拉取代码&#xff0c;构建自定分支的代码&#xff0c;构建出jar&#xff0c;并进一步构建出docker镜像&#xff0c;并推送到docker私有库中。 准备 AWS云准备 这里假设已经在CodeCommit已经存在私有git代码仓…

Macbook M1 Pro使用brew安装Docker并安装Nacos【超详细图解】

目录 一、安装 Docker 二、修改 Docker 镜像地址 三、拉取镜像-举例 Nacos 1.拉取镜像 2.查看本地镜像 3.删除镜像 四、启动容器 1.启动 Nacos 容器&#xff1a; I.方式一【推荐】 II.方式二【懒人推荐】 2.访问 Nacos Web 控制台 3.进入容器和退出容器 五、配置…

【Java】JDK1.8 HashMap源码,put源码详细讲解

&#x1f4dd;个人主页&#xff1a;哈__ 期待您的关注 在Java中&#xff0c;HashMap结构是被经常使用的&#xff0c;在面试当中也是经常会被问到的。这篇文章我给大家分享一下我对于HashMap结构源码的理解。 HashMap的存储与一般的数组不同&#xff0c;HashMap的每一个元素存…

一文读懂Partisia Blockchain,被严重低估的隐私区块链生态

在今年3月&#xff0c;隐私公链Partisia Blockchain迎来了重要的进展&#xff0c;该生态通证 $MPC上线了交易所&#xff0c;目前$MPC通证可以在Kucoin、Gate、BitMart、Bitfinex、Bitture等平台交易&#xff0c;并将在不久后上线MEXC平台。 在上个月上线市场至今&#xff0c;MP…

股票价格预测 | Python使用GAN预测股票价格

文章目录 效果一览文章概述代码设计效果一览 文章概述 生成对抗网络(GAN)是一种强大的机器学习模型,用于生成以假乱真的数据。然而,使用GAN来预测股票价格可能会面临以下挑战: 数据可用性:GAN需要大量的数据进行训练,以便生成准确的输出。对于股票价格预测,历史股票价…

单例19c RMAN数据迁移方案

一、环境说明 源库 目标库 IP 192.168.37.200 192.168.37.202 系统版本 RedHat 7.9 RedHat 7.9 数据库版本 19.3.0.0.0 19.3.0.0.0 SID beg beg hostname beg rman 数据量 1353M 说明:源库已经创建数据库实例&#xff0c;并且存在用户kk和他创建的表空间…

企业搭建分销商城系统要注意什么?

分销商城系统是一种专门设计出来的电商平台&#xff0c;旨在通过构建多层级的分销网络体系&#xff0c;帮助企业将产品或服务高效地推广和销售至终端消费者。那么&#xff0c;搭建分销商城系统要注意什么呢&#xff1f;我们从优势、功能、玩法来进行分析。 一、分销商城有哪些…

dPET论文笔记

PBPK论文笔记 题目&#xff1a;Self-supervised Learning for Physiologically-Based Pharmacokinetic Modeling in Dynamic PET 摘要 动态正电子发射断层扫描成像 &#xff08;dPET&#xff09; 提供示踪剂的时间分辨图像。从 dPET 中提取的时间活动曲线 &#xff08;TAC&a…

Java入门-数组

数组 什么是数组 数组( array )是一种最简单的复合数据类型&#xff0c;它是有序数据的集合&#xff0c;数组中的每个元素具有相同的数据类型&#xff0c;可以用一个统一的数组名和不同的下标来确定数组中唯一的元素。 数组的内存结构是分配一系列内存大小相等的连续空间。 …

SpringCloudAlibabaSeate处理分布式事务

SpringCloudAlibabaSeate处理分布式事务 1、部分面试题 微服务boot/cloud做的项目&#xff0c;你不可能只有一个数据库吧&#xff1f;那么多个数据库之间如何处理分布式事务的&#xff1f; 一个场景&#xff1a;在订单支付成功后&#xff0c;交易中心会调用订单中心的服务把订…

15. 【Android教程】按钮 Button/ImageButton

在前面两章我们讲了 TextView&#xff0c;它是一个纯输出的控件&#xff1b;而 EditText 在 TextView 基础之上加入了简单的输入功能&#xff1b;今天要讲的 Button 是一个和用户互动感很强的控件&#xff0c;从今往后不再是单纯的文本展示&#xff0c;我们可以通过 TextView、…

2024年第五届计算机视觉与信息技术国际会议(CVIT 2024)即将召开!

2024年第五届计算机视觉与信息技术国际会议&#xff08;CVIT 2024&#xff09;将于2024年8月16-18日在北京举行。CVIT 2024由北方工业大学主办&#xff0c;国内外的专家学者将齐聚一堂&#xff0c;共同分享最新的技术突破、研究方法和应用案例&#xff0c;共同推动计算机视觉与…

选择排序解读

在计算机科学中&#xff0c;排序算法是一种将数据元素按照某种顺序排列的算法。今天&#xff0c;我们要探讨的是选择排序&#xff08;Selection Sort&#xff09;&#xff0c;这是一种简单直观的排序方法&#xff0c;通过不断选择剩余元素中的最小&#xff08;或最大&#xff0…

MySOL之旅--------MySQL数据库基础( 3 )

本篇碎碎念:要相信啊,胜利就在前方,要是因为一点小事就停滞不前,可能你也不适合获取胜利,成功的路上会伴有泥石,但是走到最后,你会发现身上的泥泞皆是荣耀的勋章! 今日份励志文案: 凡是发生皆有利于我 目录 查询(select) 1.全列查询 2.指定列查询 3.查询字段为表达式 ​编…

加固系统安全,防范ssh暴力破解之Fail2Ban

你是否还在担心你的服务器被攻击&#xff1f;你是否还在担心你的博客的安全&#xff1f;你是否还在担心你的隐私&#xff1f;别急fail2ban它来了&#xff0c;它可以解决你的一切问题。 Fail2Ban 是什么&#xff1f; 现在让我们一起来认识一下今天的主角 – Fail2Ban。简单说来…

【Linux 命令】内核、驱动调试手段总结

文章目录 1. printk2. strace3. ltrace4. ptrace5. ftrace6. 动态打印7. perf8. devmem9. demsg参考&#xff1a; 1. printk printk() 是 Linux 内核中最广为人知的函数之一。它是我们打印消息的标准工具&#xff0c;通常也是追踪和调试的最基本方法。 虽然 printk() 是基于 …

深入理解中文编码:原理、应用与实践

title: 深入理解中文编码&#xff1a;原理、应用与实践 date: 2024/4/12 15:09:00 updated: 2024/4/12 15:09:00 tags: 中文编码字符集编码标准存储处理转换技术安全加密未来趋势 第一章&#xff1a;引言 编码的基本概念与作用 编码是将信息转换为特定格式以便存储、传输或处…

在启动Windows安装的Nacos时报错

Please set the JAVA_HOME variable in your environm 有可能时jdk版本过低引起的&#xff0c;所以安装一个1.8版本以上的jdk 在安装jdk完成以后配置好环境变量&#xff0c;测试一下 winr打开控制台&#xff0c;输入&#xff1a; Java -version 出现如下情况说明jdk安装配置…