升级 Vue版本从 2.5.x 到 2.6.x

升级 Vue版本从2.5.x到2.6.x

start

  • 最近项目中需要使用某些第三方插件,但是第三方插件对 vue 的版本有要求。

    插件要求 vue版本为 vue2.6.x 的,而我现有的环境是 vue2.5.x 的。

  • 记录一下 升级 Vue 版本从 2.5.x2.6.x 的过程。

正文

1. 更改 package.json

首先第一步,修改 package.json 中的 "vue": "2.6.x",然后删除旧的 node_modules,执行npm i ,重新安装依赖。

安装依赖的过程中没有报错,但是在启动本地的前端服务的时候,发生了报错

在这里插入图片描述

用翻译工具翻译一下上面的提示:

在这里插入图片描述

简单解释一下上述的报错提示:

  • 它的意思是 vue-template-compiler 和我们的 vue 版本不匹配。需要做一下处理。
  • 根据我们的 vue-loader 的版本,做不同逻辑处理。
  • 如果 vue-loader 版本大于等于10.0,只需要更新 vue-template-compiler 版本即可;
  • 如果 vue-loader 版本小于10.0,需要重新安装 vue-loader/vueify

2. 查看 vue-loader 版本

我打开一下 node_modeles 里面的 vue-loader ,查看一下的 vue-loader的版本。

在这里插入图片描述

由上图可知,我的vue-loader版本为 15.11.1。所以我只需要更新 vue-template-compiler 版本即可。

简单解释一下vue-loader是做什么的

vue-loader就是一个第三方库,然后帮助我们解析 .vue文件 的插件。

结合wabpack使用,解析我们的 .vue 文件成可以执行的js。

3. 更新 vue-template-compiler

如何更新vue-template-compiler

修改 package.json 中的 "vue-template-compiler": "2.5.17", 为 "vue-template-compiler": "2.6.x",

删除旧版本依赖,重新安装依赖即可。

为什么版本是2.6.x?

  • 网络上找到大多数资料推荐 2.6.x;(我个人暂时没找到官方的说明)

  • ps:查看了官网说明。 vue@2.7.x废弃了vue-template-compiler

    在这里插入图片描述

更新完毕 vue-template-compiler 之后,运行项目,手动测试没有发现比较明显的问题。

4. 还有哪些没有注意到的地方?

虽然是小版本升级,但是涉及到核心库的更新,还是小心谨慎一点。

我搜索了相关资料,目前整理到这几点注意事项:

  1. vue 版本增加;

    已处理√

  2. vue-template-compiler版本增加

    已处理√

  3. nextTick异步实现逻辑变更

    √ (调整了部分微任务替代方案的执行顺序,pc端主流浏览器应当不受影响)

    nextTick 在 vue 2.5 和 vue 2.6 之间有什么不同

  4. 新增了 v-slot 插槽语法,废弃 slotslot-scope

    √ (完全向后兼容,2.x保留原本语法,预计3.x完全删除。新增了 v-slot,优化了简写形式下插槽嵌套导致的作用域不清晰的问题;简化了插槽的使用方式。)

    官方对 slotslot-scope 和 v-slot 的说明

    在这里插入图片描述

end

本文完。

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

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

相关文章

线程池的相关参数

在Java中线程池是一种池化技术,用于管理和复用线程,提高线程的利用率和性能。下面是一些常见的线程池的参数及其解释: 一:线程池的七大参数 public ThreadPoolExecutor(int corePoolSize,int maximumPoolSize,long keepAliveTim…

UDP数据报套接字编程入门

目录 1.TCP和UDP的特点及区别 1.1TCP的特点 1.2UDP的特点 1.3区别 2.UDP Socket的api的介绍 2.1DatagramSocket API 2.2DatagramPacket API 3.回显客户端与服务器 3.1回显服务器 3.1.1UdpEchoServer类的创建 3.1.2服务器的运行方法start() 3.1.3main部分 3.1.4.完整…

vue3使用百度地图实现个性化地图和轨迹

vue3使用百度地图实现个性化地图和轨迹 最终效果如图: 步骤如下: 一、百度地图在vue3中的引入 1.首先在百度地图开发中心中申请ak(不多介绍) 2.两种引入方式:在 index.html 中直接引入;使用npm导包。&…

CentOS7 Zookeeper3.8.3 单节点安装

CentOS7 Zookeeper3.8.3 单节点安装 1、把压缩包丢tools里,进tools cd /tools2、解压到training tar -zxvf /tools/apache-zookeeper-3.8.3-bin.tar.gz -C /training3、进training cd /training4、重命名 mv apache-zookeeper-3.8.3-bin zookeeper5、进zookeep…

【深蓝学院】移动机器人运动规划--第7章 集群机器人运动规划--笔记

文章目录 0. Contents1. Multi-Agent Path Finding (MAPF)1.1 HCA*1.2 Single-Agent A*1.3 ID1.4 M*1.5 Conflict-Based Search(CBS)1.6 ECBS1.6.1 heuristics1.6.2 Focal Search 2. Velocity Obstacle (VO,速度障碍物)2.1 VO2.2. RVO2.3 ORCA 3. Flocking model&am…

ccadmin - 可免费试用的 FreeSWITCH web管理后台

ccadmin - FreeSWITCH web管理后台 简介免费测试在线预览功能说明 简介 顶顶通呼叫中心中间件Web后台管理系统简称CCAdmin-Web,用于管理和配置顶顶通呼叫中心中间件。因为顶顶通呼叫中心中间件是基于FreeSWITCH开发的,所以CCAdmin本质上也是一个FreeSWI…

全闪存加速信创数据库数仓一体机解决方案

立足行业,深度解读 在新的大数据生态中,传统数据库/数据仓库技术和产品成为大数据生态中的组成部分,对结构化数据的存储和计算进行支撑。 数据库&数据仓库一体机是高端、核心数据管理产品,在我国党政、银行、交通等领域广泛…

Function calling流程总结 和 用于构建Agent的Function calling流程

Function calling流程总结的步骤如下: 自定义函数:根据用户需求,自定义函数chen_ming_algorithm,用于处理特定的任务。创建字典:根据自定义函数,创建一个字典chen_ming_function,其中包含自定义…

RuoYi-Vue-Plus功能分析-jackson配置

文章目录 前言一、配置文件二、配置类三、注解四、json工具类1. 工具内容2. 使用工具 前言 前端在给我发送请求的时候一般包含三个部分url,header,body。那么就会涉及我们后端如何接收这些请求参数并且我们处理完毕参数后前端又如何接收参数 通过url传…

Java8 - LocalDateTime时间日期类使用详解

🏷️个人主页:牵着猫散步的鼠鼠 🏷️系列专栏:Java全栈-专栏 🏷️个人学习笔记,若有缺误,欢迎评论区指正 前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默&…

苹果备忘录导出方法

文章目录 前言方法1:iCloud 导出方法2:Pages 文稿导出(最推荐)方法3:借助Mac软件导出总结 前言 苹果生态真是让我们又爱又恨,其得益于无缝整合、安全性和应用程序生态系统,能够让在用户在自己的…

【LeetCode】一周中的第几天+ 一年中的第几天

2023-12-30 文章目录 一周中的第几天方法一:模拟思路步骤 方法二:调用库函数方法三:调用库函数 [1154. 一年中的第几天](https://leetcode.cn/problems/day-of-the-year/)方法一:直接计算思路: 方法二:调用…