vite

vite项目使用qiankun构建hash路由微前端

react-router-dom@61、项目安装2、主应用中注册微应用3、主应用中设置路由和挂载子应用的组件二、创建react@18+react-router-dom@6子应用1、项目安装2、修改子应用vite.config.ts3

幽冥雪羽·2025-04-12 02:10

实现一个 Markdown 编辑器组件：Vue 3 + Vite + Highlight.js

文章目录一、项目背景与需求分析二、搭建基础项目1.初始化Vue3项目2.安装依赖三、实现Markdown编辑器组件1.创建Markdown编辑器组件2.组件说明四、优化与拓展1.自动保存功能2.文件上传功能五、总结一、项目背景与需求分析在现代前端开发中，Markdown编辑器广泛应用于博客、文档、Wiki、代码注释等场景。一个优秀的Markdown编辑器需要具备以下功能：实时预览：用户输入时，能够

前端极客探险家·2025-04-11 11:32

React 初学者进阶指南：从环境搭建到部署上线

概览环境搭建核心概念TodoList实战部署上线一、快速搭建React开发环境1.选型：Vite或CreateReactAppVite：轻量、热更新速度快、可定制度高，适合追求更高效率的开发者。

yufei-coder·2025-04-11 10:55

使用 react-three-fiber 快速重构 Three.js 场景⚛️

今天，我们将更进一步，将上一篇中vite+npm传统Three.js原生代码完整重构为react-three-fiber风格✅本文将带你完成以下目标：✅使用React重构原生Three.js场景✅拆分组件化结构

sunbyte·2025-04-11 10:53

Vue3 + Vite使用Vitepress编辑基于Element-plus再次封装的Vue3基础组件库文档弃用vitepress-theme-demoblock，使用自己封装的Demo组件

最终效果使用方式页面效果一、需求vitepress-theme-demoblock插件在编辑md文件时，不支持TSX模式，也无法import其他依赖，并且展开隐藏的vue代码都在md文件中，不够优雅，且每个md文件太长。至此弃用此拆件，改用自己封装demo组件二、plugins配置：在docs/.vitepress下新建config文件夹1、在config文件夹新建global.ts文件，代码如下

wocwin·2025-04-11 04:48

npx vite 可以成功运行，但 npm run dev 仍然报错 Missing script: “dev“

npxvite可以成功运行，但npmrundev仍然报错Missingscript:"dev"，说明问题可能出在npm的脚本解析或项目配置上。以下是具体解决方案：1.检查package.json的物理位置可能原因：你当前运行的目录下可能有一个无效的package.json，而真正的package.json（含dev脚本）在另一个位置。解决方法：在终端中运行以下命令，确认package.json的路

睡美人的小仙女127·2025-04-09 23:06

深入探索 Node.js 文件监听机制：从前端工程化到原理剖析

从webpack的热模块替换到Vite的即时刷新，从CSS预处理到静态资源打包，背后都依赖于稳健的文件监听机制。

斯~内克·2025-04-09 11:50

Vite + Vue3 + TS项目根路径别名配置

本文博主将介绍如何在Vite+Vue3+TypeScript的前端项目中配置根路径别名，以便在开发过程中更轻松地引用模块和组件。为什么要配置根路径别名？

洛*璃·2025-04-09 07:55

本地项目HTTPS访问问题解决方案

以下是详细解释和解决方案：原因分析默认开发服务器仅支持HTTP大多数本地开发工具（如Vite、Webpack、React等）默认启动的是HTTP服务器，而非HTTPS。

BillKu·2025-04-09 06:49

Vue3在ZKmall开源商城前端的应用实践与技术创新

一、技术架构设计：模块化与多端协同ZKmall开源商城前端采用Vue3+TypeScript+Vite技术栈，结合微前端理念

zkmall·2025-04-09 01:14

解决vite+ts 引用本地图片 require问题

因为在vue3中require被放弃使用所有采用一下方式functionget_img_url=(name:any)=>{returnnewURL(`/src/assets/img/${name}`,import.meta.url).href;}onstdata=reactive({img_url:[{url:get_img_url("login1.jfif")},{url:get_img_url

wlik·2025-04-07 19:32

Vue3使用Webpack？

以下是详细的解释和实践指南：一、Vue3与Webpack的关系官方支持VueCLI（官方脚手架工具）在Vue3中默认仍基于Webpack，虽然Vue官方推荐新项目使用Vite，但Webpack依然是企业级项目的常见选择

繁若华尘·2025-04-07 07:46

深入解析Webpack与Vite：从原理到实战的全链路构建指南

第一章模块化演进与构建工具核心价值1.1前端模块化发展史：从混沌到标准化1.1.1原始阶段（2005-2009）全局变量污染问题：window.myApp={}立即执行函数（IIFE）实现作用域隔离：(function(){varprivateVar='secret';window.myModule={/*...*/}})();1.1.2CommonJS规范（2009）Node.js的模块实现：/

WHCIS·2025-04-07 03:24

Webpack vs Vite：现代前端构建工具的巅峰对决与选型指南

构建工具的进化革命当雪碧瓶上的水珠折射出前端工程的变迁史，Webpack与Vite的决战已然成为现代前端开发的分水岭。这场始于打包理念的革命，正在重塑整个前端生态的底层逻辑。

Loving_enjoy·2025-04-07 03:22

webpack和vite的区别是什么

Webpack和Vite都是现代JavaScript应用程序的构建工具，但它们有许多不同的设计理念和实现方式。

申朝先生·2025-04-07 03:20

Webpack vs Vite：深度对比与实战示例，如何选择最佳构建工具？

Webpack曾经是前端构建的事实标准，但随着前端生态的变化，Vite作为新一代工具迅速崛起，凭借更快的启动速度和更好的开发体验赢得了大量用户。那么，Webpack和Vite到底有哪些核心区别？

女巫的黑猫·2025-04-07 03:20

vue3+jsQr实现手机浏览器调用本地摄像头扫描并识别二维码

项目用到的技术栈：Vue3+TypeScript+Vite+jsQr，UI组件库是arcoDesign，可以根据自己的项目改为需要的，这个很好改git地址：github地址-拿来即用这个项目下载下来就能用直接跑通

一只爱吃糖的小羊·2025-04-06 20:35

vite使用总结

1、vite快速入门vite处理css资源无需配置，直接导入css资源即可。vite处理less资源，只需安装less即可，无需配置，导入less资源即可。

招财进鲍先生·2025-04-04 23:39

Vite 内联 CSS 和 JS 的解决方案

使用vite-plugin-singlefile（推荐）这个插件专门用于将整个Vite应用打包成单个HTML文件，内联所有JS和CSS。

IT码农-爱吃辣条·2025-04-04 23:36

vitest内存泄露追踪

背景项目使用vite5与vitest；自动化测试脚本产生了内存泄露。

·2025-04-04 15:01

针对vue 、 kotlin 、java 这三个语言AI辅助开发的提示词

Vue项目搭建与配置请使用Vue3和Vite搭建一个新项目，包含路由和状态管理，给出详细的配置步骤和示例代码。

人生富有·2025-04-01 11:08

vite中使用postcss-preset-env

css:{postcss:{plugins:[postcssPresetEnv({browsers:'chrome<=60',features:{'nesting-rules':true,'postcss-selector-not':false//关闭:any-link伪类处理}}),]}}但是用了postcssPresetEnv之后,会出现很多#号的类,优先级很高,会重置padding和marg

大猫会长·2025-03-31 20:50

vue2，vue3，vue3 + vite 动态加载图片的方式

记录一个小问题今天在给自己的小demo加视差滚动皮肤盒子的时候，出现了一个图片加载失败的问题，我的图片放在assets目录下。后续已解决在Vue开发中，动态绑定图片在不同版本及构建工具下有不同实现方式，具体总结如下：Vue2使用计算属性和require函数：在data中定义图片名变量，通过计算属性利用require函数根据变量值动态引入assets目录下的图片。例如：exportdefault{d

杀死一只知更鸟debug·2025-03-31 18:33

(网页系统集成CAD)WEB CAD中配置属性的使用教程

一、前言MxcadSDK能够在线预览编辑CAD图纸，用户可根据项目需求选择不同的实现方式，如通过Vite、CDN、webpack分别使用mxcad。

·2025-03-31 06:09

解决【vite-plugin-top-level-await】插件导致的 Bindings Not Found 错误

解决【vite-plugin-top-level-await】插件导致的BindingsNotFound错误环境设置操作系统:macOS硬件平台:M1Pro前端框架:Vue3Node.js版本:20在使用

coding随想·2025-03-30 23:55

vue3 vite JavaScript heap out of memory when buildin [windows or mac] 错误问题解决

打包时内存不足的问题正常流程:1、yarnaddincrease-memory-limitcross-env--dev2、package.json的scripts中添加："fix-memory-limit":"cross-envLIMIT=4096increase-memory-limit"3、yarnrunfix-memory-limit4、yarnbuildMac下流程：1.exportNOD

天河书阁 VicRestart·2025-03-30 23:54

解决 macOS (M1 Pro) 上使用 Vite 进行 Build 打包时 Node 进程内存溢出的问题

解决macOS(M1Pro)上使用Vite进行Build打包时Node进程内存溢出的问题在搭载M1Pro芯片的macOS系统上，使用Vite进行项目构建（build）时，您可能会遇到Node进程内存溢出的错误

coding随想·2025-03-30 23:53

vue对音频添加背景音乐

目录里step1:下载依赖{"name":"untitled3","private":true,"version":"0.0.0","type":"module","scripts":{"dev":"vite

勘察加熊人·2025-03-30 08:41

Vite 开发服务器漏洞

漏洞危害对于使用Vite老版本（包括但不限于>=6.2.0,=6.1.0,=6.0.0,=5.0.0,<=5.4.14；<=4.5.9）的开发者和企业运维人员来说，这是一个不容忽视的问题。

故事与他645·2025-03-30 00:50

react如何引用(按需加载)百度地图，并结合and组件化封装

1.技术选项:vite+react+antdesignload-script2.实现思路：1.按需加载如何实现?

编程猪猪侠·2025-03-29 15:21

Vue + Vite + Element Plus 与 Django 进行前后端对接

©ivwdcwso(ID:u012172506)前端实现初始化Vue+Vite项目npmcreatevite@latestfron

ivwdcwso·2025-03-29 14:47

FFmpeg运行控制台出现“SharedArrayBuffer is not defined”报错解决办法

环境：vue3+vite+ts解决办法：在项目目录中的vue.config.ts文件添加如下代码：server:{headers:{'Cross-Origin-Embedder-Policy':'require-corp

星52·2025-03-29 11:18

使用electron-vite创建桌面应用

使用electron-vite创建桌面应用一、框架搭建二、项目目录三、preload.js解读一、框架搭建官网地址https://cn.electron-vite.orgnpmcreate@quick-start

库库的写代码·2025-03-29 10:12

threejs实战数字孪生园区开源（threejs+vue3+vite）

Hello大家好，我是日拱一卒的攻城师不浪，专注前端、后端、AI学习、2D3D、GIS等学习沉淀，这是2024年输出的第10/100篇文章，欢迎志同道合的朋友一起学习交流；公众号：攻城师不浪绿泡泡：brown_7778视频效果threejs数字孪生园区前言近两年，web3D的势头逐渐兴起。例如得物的VR穿戴，贝壳的VR游览，高德地图的3D白模建筑以及VR导航，懂车帝的汽车3D展示等等，这些功能都需

攻城师不浪·2025-03-28 02:21

vue3+ts+vite项目使用 unplugin-auto-import (自动导入)

该项目是基于vite创建的vue3+ts+vue-router+pinia项目;启动项目：npminstallnpmrundev启动后遇到了以下问题：问题1：Componentname"Person"shouldalwaysbemulti-word.eslint

halo1416·2025-03-27 16:40

Vue学习记录之二十 postcss自定义插件及Unocss的使用

//vite内置了postCss无需安装import{Plugin}from'postcss'//定义一个变量constOptions={viewportWidth:375,//UI设计稿上的宽度，这里我们默认的视口宽度

LvManBa·2025-03-27 14:55

Vite CVE-2025-30208 安全漏洞

ViteCVE-2025-30208安全漏洞一、漏洞概述CVE-2025-30208是Vite（一个前端开发工具提供商）在特定版本中存在的安全漏洞。

·2025-03-27 10:05

2025年01月13日字节（本地生活）前端面试

require引入与import的引入的区别vite打包工具相比webpack优势手写promise手写发布订阅模式3.js事件循环以下是对JavaScript事件循环的更深入解释：基本概念单线程执行模型

uperficialyu·2025-03-27 07:31

【Vite构建性能优化实战：我如何将项目构建时间减少60%】

Vite构建性能优化实战：我如何将项目构建时间减少60%问题背景在我负责的前端项目中，构建时间一直是困扰开发效率的主要痛点。每次构建需要长达5分钟，严重影响了开发和部署速度。

Gazer_S·2025-03-26 15:30

Vue3+ElementPlus快速入门 | 小蚂蚁云

项目介绍基于SpringBoot3、SpringSecurity、MybatisPlus、Vue3、TypeScript、Vite、ElementPlus、MySQL等技术栈实现的单体前后端分离后台管理系统

小蚂蚁开源·2025-03-26 05:14

探索AI的无限可能，体验智能对话的未来，大模型 API 演示

探索AI的无限可能，体验智能对话的未来，大模型API演示效果展示：项目概述这是一个基于Vue3+TypeScript+Vite构建的VistaAI演示项目，旨在提供一个简洁易用的界面来展示VistaAI

Southern Wind·2025-03-26 04:41

vue+ts+vite 异步组件&suspense保姆级教程

什么是异步组件及作用1、异步组件是vue的一种优化方法，比如可以运用在首屏加载等场景2、异步组件可以减少打包的结果，会将异步组件分开打包，会采用异步的方式加载组件可以有效的解决一个组件过大的问题，不使用异步组件，如果组件功能比较多打包出来的结果就会变大。3、异步组件的核心可以给组件定义变成一个函数，函数里面可以用import语法，实现文件分割加载。异步组件示例1.在public文件夹下新建demo

白臻·2025-03-25 20:39

前端解决跨域问题

目录一.作者有话说二.第一步2.1在你的vue找到vite.config.js2.2快捷代码三.第二步3.1访问路径更改编辑3.2问题解决了四.总结【不用看，浪费大家时间】4.1安全性4.2灵活性4.3

潜意识Java·2025-03-25 10:50

基于 React 和 Vite 的前端项目自动化测试方案

背景前端自动化测试在工程化的研发体系中不可或缺。前端领域的自动化测试常被忽略，原因在于人们认为编写测试用例成本高且意义不大，本质是觉得投资回报率低。但当收益大于支出时，引入前端自动化测试是必要的。例如在表单功能从简单到复杂的迭代过程中，手动测试成本会指数级增长且可能无法完成所有测试，此时引入自动化测试能提升效率、保证测试覆盖范围、减少误差和遗漏、实现用例重复使用等。成本初始成本，引入自动化测试框架

·2025-03-25 00:31

electron+vite+vue项目的研究

目的是为了创建一个vue3的vite项目，然后可以在electron中运行，找了一些文档，具体结果如下官网的文档简介|Electron参考的链接vite-plugin-electron最详细配置方案-CSDN

renovateF5·2025-03-24 23:36

Electron + Vite + Vue 桌面应用模板

一个现代化的桌面应用开发模板，基于Electron、Vite和Vue3。

会功夫的李白·2025-03-24 23:34

使用html5-qrcode 扫描二维码(vue3)

步骤：1.安装库html5-qrcode:npmihtml5-qrcode2.开启https(这里安装@vitejs/plugin-basic-ssl模拟)//vite.config.jsimportbasicSslfrom

vayne_1·2025-03-24 22:57

深度对比：Chrome扩展框架 Crx.js vs. Plasmo vs. WXT

框架GitHub统计社区表现技术特点Plasmo11k+StarsDiscord/GitHub活跃讨论持续稳定迭代（周均5次更新）WXT6.2kStars频繁出现技术对标讨论基于Vite的现代化架构Crx.js

·2025-03-24 20:51

使用vite+react+ts+Ant Design开发后台管理项目（五）

前言本文将引导开发者从零基础开始，运用vite、react、react-router、react-redux、AntDesign、less、tailwindcss、axios等前沿技术栈，构建一个高效、

吕彬-前端·2025-03-24 08:00

六十天前端强化训练之第二十九天之深入解析：从零构建企业级Vue项目的完整指南

目录一、Vite核心原理与开发优势二、项目创建深度解析三、配置体系深度剖析四、企业级项目架构设计五、性能优化实战六、开发提效技巧七、质量保障体系八、扩展阅读推荐一、Vite核心原理与开发优势1.1为什么选择

编程星辰海·2025-03-23 22:35

推荐频道