别名vue3 vite vue
three.js 3d模型使用|vue项目使用three.js
three.js 3D模型使用 安装 安装three.js npm install three 安装轨道控件插件 npm install three-orbit-controls 安装加载.obj和.mtl文件的插件 npm install --save three-obj-mtl-loader 安 ......
vue3 对子组件使用 v-model，关于绑定对象的问题
这里有最基本的使用，vue3官网 组件 v-model 我来讲讲注意事项， 如果你 v-model 的是个 reactive 创建的对象，那么将不起作用，必须得是 ref 创建的对象 要知道，v-model： <input v-model="searchText" /> <!-- 等价于 --> < ......
websocket使用方法|vue实时推送
WebSocket实时推送 创建一个WebSocket对象： 准备变量 mounted() { // 初始化 const uri = window.location.href; // 获取网页url const protocol = uri.split("/")[0]; // https: 确定当前 ......
vue 逻辑分页
<template> <div> <div class="paging"> <!--数据显示区域--> <div class="data"> <!--表格存放数组中的数据，并对数据进行截取，以控制每一页显示的数据量--> <!--slice(start,end) 不包括end--> <el-tabl ......
NestJs系列之使用Vite搭建项目
介绍 在使用nest创建项目时,默认使用webpack进行打包,有时候启动项目需要1-2分钟。所以希望采用vite进行快速启动项目进行开发。 本文主要使用NestJs、Vite和swc进行配置。文章实操较多，概念性的东西可访问对应的官方文档进行了解。tips: 个人认为概念性的东西,在文章中指出。对 ......
vue项目目录讲解
1、build：构建脚本目录 1）build.js ==> 生产环境构建脚本； 2）check-versions.js ==> 检查npm，node.js版本； 3）utils.js ==> 构建相关工具方法； 4）vue-loader.conf.js ==> 配置了css加载器以及编译css之后自 ......
vue 深拷贝
方法一: cloneDeep import { cloneDeep } from 'lodash-es' // 直接使用 const items = cloneDeep(multipleSelection) 方法二： 通过JSON.parse(JSON.stringify(obj)) 优缺点 满足 ......
vue yarn install超时设置
一 删除代理 yarn config delete proxy 二 设置淘宝镜像 yarn config set registry https://registry.npm.taobao.org/ 三 设置超时时间 yarn install --network-timeout 1000000 ......
Vue入门（1）安装vue环境，创建Vue2 Vue3的项目并且安装IIS环境和发布到IIS
Vue环境的搭建 一. 背景 vue的运行方式有两种 一种是在页面引用vue的js包, 一种是搭建脚手架来vue框架. 我们在这里使用的是第二种方式. 需要安装的软件 npm 16.13.1 LTS 现在最新版已经20了， 建议下载LTSC版 下载地址: https://nodejs.org/en/ ......
js 传参到 vue + 计算属性使用
场景 js 中存储 xAxisData = [......]、yAxisData = [......]，想在 vue 中使用，但要求使用前转化成 data 存有若干个 (x, y) 的形式 在改变 xAxisData 或 yAxisData 的任意一值时，都会反馈更新到 vue 的每一个调用了 da ......
vue3
创建vue项目步骤 npm create vite@latest cd EasyB npm install npm run dev 绑定数据 script模块 <script > import {ref} from 'vue'; export default{ name:'App', setup() ......
vitest&@vue/test-utils组件单元测试
依赖 "vitest": "0.34.6", "@vue/test-utils": "2.4.3", "axios-mock-adapter": "^1.22.0", 示例 import { mount } from "@vue/test-utils"; import { test, vi } fr ......
Vite + Vue配置路径别名@代替 ./src
1.在 vite.config.js 引用 import {resolve} from 'path' 2.添加标黄的 export default defineConfig({ resolve:{ alias:{ "@":resolve(__dirname,"./src") } } }) 3.有图看 ......
Select语句和别名使用
-- 查询全部的学生 select 字段 from 表SELECT * FROM `student2`;-- 查询指定字段SELECT `id`,`name` FROM `student2`;-- 别名，给查询结果起个新名字，可以给字段起别名，也可以给表起别名SELECT id AS '学号1', ......
SpringBoot+Vue实现大文件分块上传
1. 项目背景由于用户需求，需要上传大量图片，只能通过上传压缩包的形式上传，可是压缩包过大时，又会出现上传超时的情况，故需要将压缩包分块上传，然后解压缩图片、若图片过大则再对图片进行压缩。 2. 分块上传分块上传我在用的时候发现有两种：第一种：分块合并接口全由后端接口生成；第二种：前端分块，后端上传 ......
介绍 Vue3 的常见目录结构
当着手使用 Vue3 开发项目时，理解其目录结构至关重要。Vue3 的文件组织和模块分隔方式直接关系到项目的可维护性和扩展性。本文将深入探讨 Vue3 的标准目录结构，并提供一些实用的指南和推荐做法。 在 Vue 3 项目中，通常会有以下一些常见的目录和文件： src 目录: src 目录是 Vue ......
介绍 Vue3 的常见目录结构
当着手使用 Vue3 开发项目时，理解其目录结构至关重要。Vue3 的文件组织和模块分隔方式直接关系到项目的可维护性和扩展性。本文将深入探讨 Vue3 的标准目录结构，并提供一些实用的指南和推荐做法。 在 Vue 3 项目中，通常会有以下一些常见的目录和文件： src 目录: src 目录是 Vue ......
node搭配ts设置路径别名
场景 不使用vite或者Webpack一类的打包工具，只单纯的使用tsc作为打包工具，其他全为原生js或者ts代码，需要配置tsconfig.json和额外引入module-alias.js这个包来使用，换句话说，无法通过只配置tsconfig.json完成别名配置，必须搭配第三方包。 配置tsco ......
SpringBoot+Vue.js实现大文件分片上传、断点续传与极速秒传
亲测好用，这里就直接上代码了，代码有详细的解释。 0. 建表语句SET NAMES utf8mb4;SET FOREIGN_KEY_CHECKS = 0; -- Table structure for file_info-- DROP TABLE IF EXISTS `file_info`;CREA ......
vite5报错Uncaught ReferenceError: require is not defined的代替方案
const files = import.meta.glob('./*.js',{eager:true}) //会得到一个对象 注意引入路径里绝对不能带有变量，会报错 //{eager:true}是定义是否同步引入的参数，去掉会得到几个异步函数，根据自己的需求写就行了 console.log(fil ......
vue2环境变量配置开发环境和生产环境
在项目根目录下新建.env文件 写入变量比如本地链接 VUE_APP_BASE_API=http://127.0.0.1:5000/ 在读取的时候使用process.env.VUE_APP_BASE_API就可以读到这个全局变量 process.env.NODE_ENV有两个值开发环境：develo ......
Vue报错：error Mixed spaces and tabs no-mixed-spaces-and-tabs
Vue报错：error Mixed spaces and tabs no-mixed-spaces-and-tabs 一、解释 在开发过程中使用了ESLint，用来规范代码风格。ESLint是语法检查工具，缺点是对所写代码要求过于严格。这里是因为空格的使用导致的。 二、报错可能出现的地方 我第一次出 ......
vue 千分位过滤器
1.创建numberToCurrency.js文件 // 千分符过滤器 export function numberToCurrencyNo(value) { if (!value) return 0 // 判断value 是否是以0开头的负数 if (value < 0 && value > -1 ......
Vue—实现文件上传（多文件），图片上传
一、图片上传//template <input type="file" accept="image/*" @change="changeImage()" ref="avatarInput" style="display:none" /> <div class="pic_list"> <div v-f ......
GitLab部署vue项目至GitLab Pages流水线配置
image: node:16.15.0 #表示使用有nodejs环境的docker，自己项目用的什么版本这就写什么版本 stages: - deploy pages: #!!!必须!!!使用pages关键字 stage: deploy script: - npm install - npm run ......
Springboot+Vue实现多文件上传
多文件上传，后端接收到多次请求vue实现 <el-upload class="upload-demo" action="http://10.240.46.88:8081/upload1" :on-preview="handlePreview" :on-remove="handleRemove" :m ......
electron-vite导出多个preload
在electron-vite创建项目的时候，src目录下会建立三个目录 第一个是主进程文件，第二个是预渲染进程文件，第三个是渲染进程文件 对于preload，默认的是导出下面的index.ts到out/preload下面，但是如果我们想导出多个preload，应该怎么设置？ 在electron.vi ......
vue如何实现文件上传及预览
vue文件上传及预览 <template> <div id="file"> <input name="files" id="uploaderInput" type="file" accept="images/*" multiple @change="change"/> <div class="fil ......
vue3中自定义ref实现防抖
import { customRef } from "vue"; /** * @description 自定义ref实现防抖 * @param {String} value * @param {Number} delay * @returns */ export const debounceRef ......
[Vue]脚手架创建项目
文档：https://cli.vuejs.org/zh/ (脚手架最新版本是4.x) 1. 如果安装速度过慢，可以指到国内安装地址：npm config set registry https://registry.npm.taobao.org 2. 首次安装（全局）：npm install -g @ ......