IM2研究舍 - Vue
type: channel
link: https://www.imao2.com/tag/Vue/
items: 【eslint-plugin-vue】提示 vue/no-multiple-template-root
items: 维护vue2项目更新依赖无法运行解决过程
items: Vue 实现无缝滚动

【eslint-plugin-vue】提示 vue/no-multiple-template-root
type: item
date: 2024-06-18T17:19:18+08:00
description: 背景：明明 vue3 是支持多个根节点的，但是在 vscode 中还是存在提示，看着很烦想去除解决方案：打开 setting.json ，输入 vetur,找到 Vetur>Validation:Template,把复选框去除即可

维护vue2项目更新依赖无法运行解决过程
type: item
date: 2024-05-11T14:23:00+08:00
description: 背景目前已都是用 vue3 相关进行项目开发，但是依旧还有vue2的工程进行维护。遇到的问题问题一：删了node_modules 文件夹 和 lock 文件后使用 pnpm install 安装，发现无法运行，排查使用了webpack 4.x.x 版本的，此版本的 babel-loader 一系列版本需要安装对应版本的才可运行解决方案： 安装对应版本的依赖 --save-dev babel-loader@^8.2.3 @babel/core@^7.12.0 @babel/preset-env@^7.12.0问题二：编译运行的时候出现 TypeError: Cannot read properties of undefined (reading 'spaces') 解决方案：排查发现是 scss 文件中存在 /*这是一个注释*/ 这类文本，删除即可。

Vue 实现无缝滚动
type: item
date: 2020-09-23T16:56:00+08:00
description: 两种方式实现，一种为可以暂停的，一种为不可暂停的。不可暂停不可暂停的直接利用 vue 自带的 transition 和元素的显隐来实现注意低版本的 css 动画要根据 vue 的版本来调整，如下案例中 css 代码为 vue 2.5.2中的写法不可暂停无缝滚动以此类推，左右切换，上下切换都可以用这种方式实现。可暂停上面的方式没法暂停，下面一种是可以暂停的。可暂停无缝滚动