Little_Fishs的博客

解决vscode中vue3代码不高亮显示的问题

Little_Fishs — Fri, 25 Jul 2025 16:39:22 +0800

有时项目工作区的 TypeScript 版本可能与 Volar 不兼容。Volar 需要一个 tsconfig.json 文件来理解项目的 TypeScript 配置。请确保你的项目根目录下有这个文件，并且配置是正确的。通常情况下，方案一（禁用 Vetur）和方案二（重启服务）能够解决 90% 的问题。特别注意 include 字段，确保它包含了你的 .vue 文件。方案三：使用 VS Code 的内置 TypeScript 版本。确保你的 VS Code 和 Volar 插件都是最新版本。

修复Git远端意外挂断

Little_Fishs — Wed, 25 Dec 2024 13:37:45 +0800

修复git 远端意外挂断了的问题

解决Vue项目打包后dist中的index.html用浏览器直接打开显示空白页或者page not found的问题

Little_Fishs — Tue, 10 Dec 2024 15:17:16 +0800

Vue实现打包后直接访问

Mac电脑遇到DNS解析失败，ip可以访问，域名无法访问

Little_Fishs — Wed, 21 Aug 2024 13:52:55 +0800

具体操作步骤如下：打开“系统偏好设置”，点击“网络”，选择当前使用的网络连接（Wi-Fi或有线连接），点击“高级”按钮，在“DNS”选项卡中，点击左下角的“+”按钮添加新的DNS服务器地址，输入。可以在“系统偏好设置”中找到“安全性与隐私”，然后点击“防火墙”选项卡来检查防火墙设置。‌联系网络服务提供商或技术支持团队‌：如果以上方法都无法解决问题，建议联系网络服务提供商或技术支持团队寻求进一步帮助。可以将网络连接的 DNS 服务器设置为公共 DNS 服务器，如谷歌的。：尝试更改使用的DNS服务器。

【vue】ant-design弹出框无法关闭和runtimecore提示isFucntion is not function的问题修复

Little_Fishs — Wed, 06 Mar 2024 16:15:34 +0800

2.弹框关闭失效问题，vue版本自动升级为3.4.x，ant- design也自动升级版本，新版本出现的这个问题，建议vue降低为3.3.X以下，vue-tsc降低为1.6.5，ant- design降低版本为3.2.20。【vue】ant-design弹出框无法关闭和runtimecore提示isFucntion is not function的问题修复，初步分析是vue发布3.4版本以后引起的兼容性问题。建议vue不要升级大版本，改为"vue": “~3.3.4”,重新安装依赖，再重新启动项目。

路由为data或者dataQuery报错：Uncaught SyntaxError: Unexpected token ‘＜‘，页面无法加载

Little_Fishs — Tue, 07 Feb 2023 10:06:18 +0800

路由为data或者dataQuery报错：Uncaught SyntaxError: Unexpected token '

配置npm

Little_Fishs — Sat, 02 Jul 2022 06:30:38 +0800

配置npm

This is probably not a problem with npm. There is likely additional logging output above. 报错解决思路

Little_Fishs — Fri, 01 Jul 2022 23:59:01 +0800

解决npm安装失败的问题

vue基于axios封装拦截器及实现上传下载等功能

Little_Fishs — Thu, 23 Jun 2022 10:43:15 +0800

vue封装拦截器及实现上传、下载等功能

vue中如何判断一个Observer对象，是否有属性

Little_Fishs — Mon, 09 May 2022 19:27:38 +0800

Vue2.6新增了observable函数，用于生成一个响应式对象。关于observable函数，Vue官方文档是这样描述的：在 Vue 2.x 中，被传入的对象会直接被 Vue.observable 变更，所以如这里展示的，它和被返回的对象是同一个对象。在 Vue 3.x 中，则会返回一个可响应的代理，而对源对象直接进行变更仍然是不可响应的。因此，为了向前兼容，我们推荐始终操作使用 Vue.observable 返回的对象，而不是传入源对象。 Object.entries(obj).length

正则匹配“加减乘除，等于，不等于，或，大于等于”等运算符，并分割运算符前后的字符

Little_Fishs — Sun, 17 Apr 2022 08:53:28 +0800

正则匹配“+,-,*,/,==,!=,>=,<=,<,||”等运算符，并分割运算符前后的字符，代码如下： const reg = /×|-|[/]|[+]|==|!=|>=|>|<=|<|\|\|/; // 以+,-,*,/和==,!=,>,>=,<,<=,||运算符分割 const str="tag||tag2" const str.aplit(reg) // ["tag","tag2"] 下表为匹配的含义：字符描

SortableJS/vuedraggable 在vue中应用，两栏内容互相拖拽

Little_Fishs — Tue, 01 Mar 2022 15:23:39 +0800

官方网址：https://github.com/SortableJS/Vue.Draggable demo:https://sortablejs.github.io/Vue.Draggable/#/simple

ROCS1

利用codemirror，生成yaml编辑器（vue）

Little_Fishs — Thu, 27 Jan 2022 13:48:11 +0800

1.YAML和yaml互换json和yaml文件： 1.1 下载js-yaml和yaml组件 npm install yaml --save npm install js-yaml --save 1.2 封装工具类 import YAML from 'yaml' import yaml from 'js-yaml' // json转换为yaml格式 export const json2yaml = (jsonData) => { try { return {

js File文件转换为二进制格式和base64转换为图片

Little_Fishs — Thu, 09 Dec 2021 16:16:38 +0800

// 图片转换为base64 imageToBase64(img) { return new Promise((resolve) => { let reader = new FileReader(); reader.readAsDataURL(img); //转化二进制流，异步方法 reader.onload = (e) => { // console.log(e.target.result,'-----re

vue实现多栏布局拖拽（改变盒子的宽度）

Little_Fishs — Tue, 07 Sep 2021 09:56:02 +0800

一、目标： vue 实现多个盒子（用户根据实际场景决定盒子数量）自由拖拽，改变宽度。二、应用场景：可自由拖动宽度的多栏布局。最典型的案例：编辑器（eg:vscode,idea等）三、组件设计由于该组件盒子数量不确定，所以我们设计组件时参考了Vuetify中的Form和FormItem的设计。即：外层大盒子处理分发的拖拽事件，里层的盒子负责展示各个Item的内容。组件设计实现目标： &

tsc-node : 无法将“tsc-node”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。解决方案

Little_Fishs — Thu, 26 Aug 2021 22:00:50 +0800

安装 # Locally in your project. npm install -D typescript npm install -D ts-node # Or globally with TypeScript. npm install -g typescript npm install -g ts-node # Depending on configuration, you may also need these npm install -D tslib @types/node Tip: I

tsc : 无法加载文件，因为在此系统上禁止运行脚本

Little_Fishs — Wed, 25 Aug 2021 20:08:54 +0800

问题描述如下： 1、TypeScript安装成功 2、vscode上点击终端 > 执行tsc命令报错解决方法：（亲测可用）以管理员身份运行 PowerShell，并执行命令 set-ExecutionPolicy RemoteSigned将PowerShell的执行策略更改为RemoteSigned 1、win+x 选择Windows PowerShell 即可打开shell 2、运行 set-ExecutionPolicy RemoteSigned 命令，在询问更改执行策略的时候，输入 Y 3、

vue拖拽实现

Little_Fishs — Tue, 06 Jul 2021 10:07:56 +0800

https://segmentfault.com/a/1190000013606983 目标是将左侧list中的item拖入右侧card中,如下所示：（将list1和list3拖入右侧拖拽区）一、拖拽样式实现使用vue + vuetifyjs实现。页面布局可根据不同的UI库自行修改。 html内容：

Little_Fishs的博客

解决vscode中vue3代码不高亮显示的问题

修复Git远端意外挂断

解决Vue项目打包后dist中的index.html用浏览器直接打开显示空白页或者page not found的问题

Mac电脑遇到DNS解析失败，ip可以访问，域名无法访问

【vue】ant-design弹出框无法关闭和runtimecore提示isFucntion is not function的问题修复

路由为data或者dataQuery报错：Uncaught SyntaxError: Unexpected token ‘＜‘，页面无法加载

配置npm

This is probably not a problem with npm. There is likely additional logging output above. 报错解决思路

vue基于axios封装拦截器及实现上传下载等功能

vue中如何判断一个Observer对象，是否有属性

正则匹配“加减乘除，等于，不等于，或，大于等于”等运算符，并分割运算符前后的字符

SortableJS/vuedraggable 在vue中应用，两栏内容互相拖拽

ROCS1

利用codemirror，生成yaml编辑器（vue）

js File文件转换为二进制格式和base64转换为图片

vue实现多栏布局拖拽（改变盒子的宽度）

tsc-node : 无法将“tsc-node”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。解决方案

tsc : 无法加载文件，因为在此系统上禁止运行脚本

vue拖拽实现

欢迎来到小余的梦幻王国~

vue拖拽或点击上传图片

vue中使用viewer.js 插件预览图片