vue3搭建(vite+create-vue)

目录

前提条件

输入命令

 对于Add an End-to-End Testing Solution   nightwatch和Cypress 和 Playwright 

运行


前提条件

  • 熟悉命令行
  • 已安装 16.0 或更高版本的 Node.js (node -v查看版本)

 输入命令

npm init vue@latest

 这一指令将会安装并执行 create-vue,它是 Vue 官方的项目脚手架工具。你将会看到一些诸如 TypeScript 和测试支持之类的可选功能提示

  Project name: ... vue-project   项目名称:Vue 项目
√ Add TypeScript? ... No / Yes  添加 TypeScript?   不添加 TypeScript,意味着项目将继续使用普通的 JavaScript,而不是 TypeScript
√ Add JSX Support? ... No / Yes 添加 JSX 支持? 不添加 JSX 支持,这意味着项目不会使用 JSX 语法
√ Add Vue Router for Single Page Application development? ... No / Yes 添加 Vue Router 用于单页面应用开发?添加 Vue Router,用于管理单页面应用程序的客户端路由
√ Add Pinia for state management? ... No / Yes 添加 Pinia 用于状态管理?添加 Pinia,用于 Vue.js 应用程序的状态管理,提供了一个集中式的存储机制来管理应用程序状态
√ Add Vitest for Unit Testing? ... No / Yes 添加 Vitest 用于单元测试  用于单元测试。这样可以对项目中的各个单元(组件、函数等)进行测试
√ Add an End-to-End Testing Solution? » No 添加端到端测试解决方案?
√ Add ESLint for code quality? ... No / Yes 添加 ESLint 用于代码质量?用于代码质量检查。这将帮助强制执行代码编写标准并识别代码库中的潜在问题。

对于Add an End-to-End Testing Solution   nightwatch和Cypress 和 Playwright 

Nightwatch、Cypress 和 Playwright 都是用于 Web 应用程序的端到端测试框架,它们可以模拟用户在浏览器中的行为,执行各种操作并检查应用程序的行为是否正确。

  1. Nightwatch: Nightwatch 是一个基于 Node.js 和 WebDriver 的端到端测试框架,用于自动化 Web 应用程序的测试。它提供了简单易用的 API,允许开发人员编写测试用例并对多种浏览器进行测试。Nightwatch 支持断言库和测试报告生成,可以在单个测试中运行测试用例,也可以进行分组和并行测试。

  2. Cypress: Cypress 是一个现代化的端到端测试框架,专注于简化测试的编写和调试过程。它在一个浏览器中运行测试,并且提供了强大的命令和断言库,使测试用例编写变得非常直观和容易。Cypress 还具有实时重加载功能,可以在代码更改时自动重新运行测试。Cypress 的可视化测试运行和调试功能使得定位和修复问题更加便捷。

  3. Playwright: Playwright 是由 Microsoft 开发的端到端测试和自动化框架。与其他测试框架不同,Playwright 可以在多个浏览器(Chrome、Firefox、WebKit)中执行测试,并支持更多的操作,如截图、录制、模拟设备等。Playwright 提供了强大的 API,可以与 TypeScript 集成,提供了更好的类型支持。它对 Web 标准的支持非常全面,可以测试更复杂的场景。

选择适合的框架取决于项目需求和团队偏好。Cypress 和 Playwright 在功能和易用性方面较为领先,而 Nightwatch 也是一个成熟的选择。如果需要多浏览器支持和更广泛的功能,Playwright 可能是更好的选择。如果重视简洁性和易用性,Cypress 也是非常出色的选择。

运行

cd <your-project-name>

npm install

npm run dev

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

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

相关文章

Meta AI研究团队新AI模型: Llama 2 大语言模型

Llama是Facebook Research团队开发的基础语言模型集&#xff0c;旨在提供广泛的语言理解能力。它基于转换器架构&#xff0c;参数范围从7B到65B。通过使用Llama模型&#xff0c;研究人员和开发人员可以构建更先进的自然语言处理系统。您可以在GitHub上找到相关的代码和资源&…

kotlin 编写一个简单的天气预报app(四)增加界面显示

编写界面来显示返回的数据 用户友好性&#xff1a;通过界面设计和用户体验优化&#xff0c;可以使天气信息更易读、易理解和易操作。有效的界面设计可以提高用户满意度并提供更好的交互体验。 增加城市名字的TextView <TextViewandroid:id"id/textViewCityName"…

web基础与http协议

dns域名&#xff1a;网络是基于tcp/ip协议进行通信和连接的 ip地址&#xff1a;每一台主机都是有一个唯一的地址标识&#xff08;固定的ip地址&#xff09; 作用&#xff1a;1、区分用户和计算机 2、通信 ip地址的问题&#xff1a;由32位二进制数组成&#xff0c;不方便记忆…

CentOS 7虚拟机 虚拟机安装安装增强VBox_GAs_6.1.22失败:modprobe vboxguest failed

我安装的CentOS 在安装增强工具的时候报错: 查阅资料后 &#xff0c;解决方法&#xff1a; 1、更新kernel内核版本&#xff1a; yum update kernel -y //安装kernel-devel和gcc编译工具链yum install -y kernel-devel gcc//更新kernel和kernel-devel到最新版本yum -y upgrade …

就业并想要长期发展选数字后端还是ic验证?

“就业并想要长期发展选数字后端还是ic验证&#xff1f;” 这是知乎上的一个热点问题&#xff0c;浏览量达到了13,183。看来有不少同学对这个问题感到疑惑。之前更新了数字后端&数字验证的诸多文章&#xff0c;从学习到职业发展&#xff0c;都写过&#xff0c;唯一没有做过…

windows编译ncnn

官方代码https://github.com/Tencent/ncnn/wiki/how-to-build#build-for-windows-x64-using-visual-studio-community-2017 编译工具 visual studio 2017 一、编译protobuf 1、下载protobuf protobuf-3.11.2&#xff1a;https://github.com/google/protobuf/archive/v3.11…

指针初阶(超详解)

指针初阶 1.指针是什么2.指针和指针类型2.1 指针-整数2.2 指针的解引用 3.野指针3.1 野指针成因3.2如何避免野指针 4.指针运算4.1 指针-整数4.2 指针-指针4.3 指针的关系运算 5.指针和数组6.二级指针7.指针数组 1.指针是什么 指针是什么&#xff1f; 指针理解的2个要点&#xf…

Class.forName和ClassLoader区别

【反射中&#xff0c;Class.forName和ClassLoader区别】_lfsun666的博客-CSDN博客

docker启动报错:Cannot connect to the Docker daemon

Couldn’t connect to Docker daemon at httpdocker://localunixsocket - is it running? 解决方式&#xff1a;正确的是将当前用户加入docker组解决步骤 sudo groupadd docker #添加docker用户组 sudo gpasswd -a $USER docker #将登陆用户加入到docker用户组中 ne…

SDWAN的技术背景及其发展历程

一、SDWAN&#xff08;软件定义广域网&#xff09;技术的背景 传统广域网&#xff08;WAN&#xff09;主要基于专线连接&#xff0c;例如MPLS&#xff08;多协议标签交换&#xff09;网络&#xff0c;用于连接企业的分支机构和总部。这些传统的WAN网络在过去是为了满足数据中心…

BladeX框架开源-工作-笔记-Docker部署-Jenkins配置

BladeX框架开源-工作-笔记-Docker部署-Jenkins配置 文章目录 BladeX框架开源-工作-笔记-Docker部署-Jenkins配置第一章-概要-BladeX框架简介与git地址第二章-BladeX框架前后端项目Docker部署与DockerFile配置文件2.1-开始部署阶段&#xff0c;默认服务器上面已有Nacos服务2.2-采…

maven下载按照及初次使用相关配置

maven下载按照及初次使用相关配置 一、下载 与安装 依赖Java&#xff0c;需要配置JAVA_HOME设置MAVEN自身的运行环境&#xff0c;需要配置MAVEN_HOME测试环境配置结果 MVN测试成功&#xff01;&#xff01;&#xff01; 二、本地仓库配置 Maven启动后&#xff0c;会自动保…

基于Amoeba读写分离(三十六)

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、pandas是什么&#xff1f;二、使用步骤 1.引入库2.读入数据总结 前言 今天要学的是基于Amoeba读写分离。Amoeba是一个开源的关系型数据库管理系统&#xf…

Spark性能调优之数据序列化

前言 在使用Spark进行数据开发的时候,避不开的一个问题就是性能调优。网上一搜一大堆所谓的调优策略很多作者自己都不知所云,导致读者看了后只会更加困惑。我们在研究一个技术的时候第一手资料永远都请参考官网,官网对性能优化不一定是最全甚至最优,但是可以解决大部分问题…

六、初始化和清理(4)

本章概要 数组的初始化 动态数组创建可变参数列表 枚举类型 数组初始化 数组是相同类型的、用一个标识符名称封装到一起的一个对象序列或基本类型数据序列。数组是通过方括号下标操作符 [] 来定义和使用的。要定义一个数组引用&#xff0c;只需要在类型名加上方括号&#xf…

NestJS 的 拦截器 学习

拦截器会用到RxJs&#xff0c;所以在学习拦截器之前可以先了解一下它。 拦截器是使用Injectable()装饰器装饰的类并且实现了接口NestInterceptor。 拦截器受到 AOP(面向切面编程)技术的启发&#xff0c;具有如下的功能&#xff1a; 在方法执行之前/之后绑定额外的逻辑转换函…

express学习笔记2 - 三大件概念

中间件 中间件是一个函数&#xff0c;在请求和响应周期中被顺序调用&#xff08;WARNING&#xff1a;提示&#xff1a;中间件需要在响应结束前被调用&#xff09; 路由 应用如何响应请求的一种规则 响应 / 路径的 get 请求&#xff1a; app.get(/, function(req, res) {res…

以beam search为例,详解transformers中generate方法(上)

以beam search为例&#xff0c;详解transformers中generate方法&#xff08;上&#xff09; 1. generate的代码位置2. GenerationMixin概览3. generate签名4. generate过程4.1 读取并更新generation config4.2 补充没有传入的参数4.3 定义模型输入4.4 定义模型的其他参数4.5 对…

Mysql存储过程基本语法

目录 存储过程MYSQL基础语法游标&#xff08;作用范围存储过程&#xff09;事务&#xff08;Demo&#xff09;其他操作Demo 存储过程 MYSQL 基础语法 #创建存储过程 #参数格式 #in输入参数 out输出参数 inout既可以输入也可以输出 create or replace procedure 存储过程名…

react常用知识点

React是一个用于构建用户界面的JavaScript库。以下是React常用的知识点&#xff1a; 组件&#xff1a;React将用户界面分解成小而独立的组件&#xff0c;每个组件都有自己的状态和属性&#xff0c;并且可以通过组合这些组件来构建复杂的用户界面。 // 函数组件示例 function We…