- 综合排序
- 最热优先
- 最新优先
- 来自专栏Mintimate's Blog
ViteConf 2023结束，现在的Vite发展如何？是时候使用Vite了么？
已经2023年了，Vite现在发展怎么样呢？现在是时候切换到Vite么？ 当然，很多开发者可能对尤雨溪的“The State of Vite”更感兴趣，本次我们就来介绍一下Vite的发展，同时融合看看现在使用Vite怎么样？ 按需编译：Vite只在浏览器请求时才对源代码进行编译，省去了大量不必要的打包时间；这点其实要电脑性能足够，我用过公司的六代i5标压电脑，可以说…… Vite也救不了。 在我看来，Nuxt主要的特点：全面支持和使用Vite： Nuxt3版本开始，默认使用Vite作为构建工具，当然你也可以切换为Webpack5，但是我觉得大部分人不会这么做；采用动态生成和静态生成并存的 More当然，还有其他框架也在逐渐适配Vite，比如：Angular在5月份支持使用Vite作为构建工具。图片为什么Angular CLI开始使用Vite?
1.9K113编辑于 2023-10-10 - 来自专栏小鑫同学编程历险记
开发H5都会喜欢这个Vite插件
同时我信奉分享是成长的唯一捷径，在这里也希望我的每一篇文章都能成为你技术落地的参考~ 在开发小程序的时候经常会通过手机扫描小程序开发工具生成的二维码来快速在手机上打开正在开发的小程序进行功能调试，但是在H5开发时却还是通过聊天软件来粘贴地址 Vite插件开发辅助 开发Vite插件建议使用开源项目generator-vite-plugin，可以通过简单了两步操作实现一个Vite插件开发的基本环境,还贴心的配置了调试脚本方便第一次开发插件时手忙脚乱 ； 1.1 安装generator-vite-plugin： $ npm i -g yo $ npm i -g generator-vite-plugin 1.2 生成Vite插件基本环境： $ yo vite-plugin 2. IP访问H5页面，Local地址无效； Vite默认启动不提供Network地址，需要增加--host 参数，插件中默认已配置； 2.1 获取Vite启动后分配的URLs： vite命令执行后会在终端启动一个开发服务器
68630编辑于 2022-12-26 - 来自专栏HarmonyOS知识集合
【HarmonyOS 5】鸿蒙发展历程
【HarmonyOS 5】鸿蒙发展历程一、鸿蒙 HarmonyOS 版本年代记鸿蒙 1.0：2019 年 8 月 9 日，华为在开发者大会上正式发布鸿蒙 1.0 系统，这一版本首次应用于华为荣耀智慧屏产品中 原生鸿蒙正式版也在 2025 年 3 月发布，进一步推动了鸿蒙生态向更纯粹、更自主的方向发展 。鸿蒙PC将在2025年5月发布。 到了 2019 年 5 月 14 日，华为鸿蒙商标获得注册公告，专用权限期从 2019 年 5 月 14 日至 2029 年 5 月 13 日，这为鸿蒙系统的商业化推广与应用提供了品牌保障，也正式拉开了鸿蒙系统在智能终端市场上的探索与发展序幕 三、鸿蒙的未来从当前技术趋势、市场环境和华为的战略布局来看，鸿蒙未来发展潜力巨大。 依托华为在 5G、芯片、物联网等领域的深厚积累，鸿蒙有望主导中国市场的智能家居和车联网标准，巩固万物互联入口地位。开发者生态也将迎来爆发式增长。
1.7K10编辑于 2025-06-29 - 来自专栏快乐阿超
vite
分享一个前端开发与构建工具vite，官网： https://vitejs.cn/ 可以以极快的方式冷启动项目，极快的速度热重载HMR(Hot Module Replacement) 使用方式按照官方文档创建项目即可 https://vitejs.cn/guide/#scaffolding-your-first-vite-project
42020编辑于 2022-08-21 - 来自专栏h5
electron31+vite5+elementPlus桌面端管理系统ElectronViteAdmin
vite5-electron-admin整合vitejs+electron跨平台技术。实现常用的表格、表单、图表、列表、编辑器等业务场景。 使用技术编码工具：vscode技术框架：vite^5.3+vue^3.4+vue-router^4.4跨平台技术：electron^31.3.0UI组件库：element-plus^2.7.8状态管理： ：echarts^5.5.1markdown编辑器：md-editor-v3^4.18.0模拟数据：mockjs^1.1.0打包工具：electron-builder^24.13.3特性最新前端技术栈Vite5 、Echarts支持中英文/繁体国际化解决方案支持动态权限路由、多页签缓存路由封装多窗口管理器内置4种通用布局模板、自由切换风格整合通用的表格、表单、列表、图表、编辑器、错误处理等模块项目结构模块使用vite.js
79220编辑于 2024-08-19 - 来自专栏京东技术
京东快递H5项目接入vite实战
随着H5 项目迭代，项目的启动时长在慢慢增长，目前H5的首次启动时长约为 1分钟；且文件的更新也可能触发大范围的依赖重新打包。 vite、snowpack等bundless类型的打包工具的出现就是为了解决这个问题。本文将结合实际项目（京东快递H5）实现 vite 打包工具的无痛接入。 【HTML/XML】 <script> global=globalThis </script> 5. defineConfig({ define: { 'process.env': process.env, }) 6. rollup 中不支持动态require 打包编译，而由于H5 两种项目启动结果对比如下图： 图1 vite 启动H5工程 图2 vue-cli 启动H5工程 1.
1K10编辑于 2023-09-21 - 来自专栏全栈开发工程师
【Vite基础】003-Vite 中使用 TypeScript
【Vite基础】003-Vite 中使用 TypeScript 一、Vite 天生支持 ts 1、只编译，不校验 在开发环境中，Vite 使用 es build ，es build 本身支持 ts 语法 第四步：结论 vite 支持 ts 语法，只编译，可直接使用，但不校验！ build 改为 tsc --noEmit && vite build { "name": "vite-vue3", "private": true, "version": "0.0.0 & vite build { "name": "vite-vue3", "private": true, "version": "0.0.0", "type": "module", "scripts": { "dev": "vite", "build": "vue-tsc --noEmit && tsc --noEmit && vite build",
79020编辑于 2025-01-06 - 来自专栏Web Front End
深入浅出 Vite5 中依赖预构建
简单来说，上述的 5 个步骤就是 Vite 依赖预构建的过程。 有些同学可能会好奇，预构建生成这样的文件怎么使用呢？ custom-vite! 了解过 Vite 的朋友都清楚，Vite 中的入口文件和其他沟通工具不同的是：vite 中是以 html 文件作为入口文件的。 完成上述过程后，我们再次在使用到的项目中 custom-vite-use 中运行 custom-vite 命令： 此时，我们已经实现了一个简易版本的 Vite 预构建过程。 首先，Vite 目录下的 /pakcages/vite/bin/vite.js 文件是作为项目 cli 入口文件。
1.6K21编辑于 2024-01-30 - 来自专栏技术社区
Vite简介
Vite是一个快速、轻量级的前端构建工具，它可以让开发者更高效地进行前端开发。相比于其他构建工具，Vite的特点在于快速的冷启动、模块热替换和按需编译等功能。 下面我们将详细探讨Vite的优势和如何使用它。 什么是Vite Vite是一款基于Rollup的构建工具，主要用于构建Web应用程序和库。 Vite的优势 快速的冷启动 Vite采用了服务端渲染的方式，不需要像其他构建工具那样预先编译打包所有的JS文件。 这意味着，每当您修改代码时，Vite只会重新构建所修改的那部分代码，而不会重新构建整个应用程序。因此，Vite的冷启动非常快，几乎没有任何延迟。 模块热替换 Vite支持模块热替换（HMR），这使得在开发过程中对代码进行调试变得非常方便。当您修改代码时，Vite会自动重新加载该模块，而不是刷新整个页面。
1.5K20编辑于 2023-06-04 - 来自专栏h5
vite5.x+vue3 setup网页版pc聊天模板
vite5-webchat 实现了聊天、通讯录、朋友圈、短视频、我的等模块。支持收缩侧边栏、背景壁纸、锁屏、最大化等功能。 运用技术 开发工具：VScode 技术框架：vite5.2+vue3.4+vue-router4.3+pinia2 UI组件库：element-plus^2.7.5 状态管理：pinia^2.1.7 地图插件 ：@amap/amap-jsapi-loader 视频滑动：swiper^11.1.4 样式编译：sass^1.77.4 构建工具：vite^5.2.0 项目结构目录 采用vite5.x构建工具搭建项目 video-player-type="h5-page" x5-video-player-fullscreen="true" playsinline </template> Ok，综上就是vite4+element-plus开发网页版聊天项目的一些知识分享，希望对大家有所帮助！
54610编辑于 2024-06-24 - 来自专栏与前端沾边
Vite 学习（四） - vite 插件开发预学习
vite 插件需要兼容 rollup 和 esbuild 的插件机制，虽然 vite 兼容大部分 rollup 插件，但不是所有钩子都支持，本小节介绍下 vite 中的钩子及插件开发流程。 我们自己开发的 vite 插件命名规则也保持 vite-plugin-xxx 格式。 modulePased 钩子 打包钩子和输出钩子间没有强耦合， output 阶段的钩子不会执行 vite 独有的钩子 config 返回对象，合并到 vite.config.js 中配置中。 res.end('hellp test') } else { next() } }) } },[2b89ee42-cf87-414a-b006-5fe6856e7948 .png] transformIndexHtml 获取入口的 html 文件，可以对其进行转换操作，动态修改 [f1a2b753-acb5-4cf2-8b8a-74ce2a3761f1.png] handleHotUpdate
2.4K40编辑于 2022-02-19 - 来自专栏程序员成长指北
5分钟搭建 vite + vue3 工程，简单，实用！
介绍 本文主要介绍 vite + vue3 + vue-router4 + vuex4 + ant-design-vue2 + axios + mockjs 工程搭建。 2021年，若还没有体验过 vite 的速度，要抓紧动手试一下啦！ 创建 vite 项目 执行创建命令 执行 vite 项目创建命令，在创建导航过程中，选择 vue+ts 模式。 yarn create vite yarn yarn dev 复制代码 修改 vite 配置文件 当以命令行方式运行 vite 时，vite 会自动解析项目根目录下名为 vite.config.js 中需要安装 vite-plugin-mock 插件。 执行安装命令 yarn add mockjs yarn add vite-plugin-mock -D 复制代码 vite.config.ts 中引用插件 import { viteMockServe
6K41编辑于 2021-12-22 - 来自专栏愧怍的技术学习与分享
Vite使用WebWorker
准备给我的一个 Vite 项目进行重构，其中一个功能(函数)要花费 JS 主线程大量时间，会导致主线程画面卡死，无法正常点击，直到该功能(函数)执行完毕而言。 （5）文件限制 Worker 线程无法读取本地文件，即不能打开本机的文件系统（file://），它所加载的脚本，必须来自网络。 综合以上限制，我所要重构的功能面临以下问题 一些 window 下的函数，或者主线程下全局数据函数，无法共同 无法读取本地文件，需要创建网络文件（如 Blob 或 Vite 导入） Worker 线程和主线程通信要使用 所以在考虑使用 Worker 的时候就要考虑这个功能是否值得使用 Worker，能否使用 Worker 实现 Vite 中使用 WebWorker 这里先给出我的最优解，在 Vite 中静态资源处理 console.log('test.worker.js', e.data) self.postMessage('hello from worker') }, false, ) 不过 Vite
2.4K10编辑于 2022-12-27 - 来自专栏前端小叙
vite配置别名
vite.config.ts import { resolve } from "path"; export default defineConfig({ resolve: {
1.8K40编辑于 2023-02-10 - 来自专栏HTML5学堂
HTML5发展历程
HTML5发展历程 HTML5学堂：HTML5应该说是一个新名词了，由最初的网页设计与制作，发展到WEB前端开发工程师，又演变出HTML5的“新名词”。那么HTML5到底是什么时候出现苗头的？ 而今的HTML5又发展如何了呢？故事在继续~~~ 2008年，HTML5发布首个版本。 2010年 1 月，YOUTUBE 推出 HTML5 播放器。 2010年 5 月，Scribd 文档转化成 HTML5。 2010年 8 月，Arcade Fire 拍摄了 HTML5 技术的交互式电影。 2011年，约 20% 的研发商使用 HTML5 技术做为应用开发。 2012年 4 月，Flickr 引入 HTML5 图片上传工具。 2014年，微信平台的飞速发展推动了HTML5的发展。 2015年，HTML5、WEB前端就业需求量飞速猛增，翻倍式的增长，明确的告诉我们“HTML5”真的来了~！
1.4K60发布于 2018-03-12 - 来自专栏腾讯新闻前端团队
wp2vite ~ 让webpack项目支持vite
/tnfe/wp2vite why vite 在浏览器支持 ES 模块之前，JavaScript 并没有提供的原生机制让开发者以模块化的方式进行开发。 github: https://github.com/tnfe/wp2vite npm: https://www.npmjs.com/package/wp2vite 如果有人不知道webpack 和vite 前段时间写过一篇vite解析和尝试的一篇文章 ,在文章最后，舔狗了一下："vite,真香"。 安装与使用 关于wp2vite的安装，与其他命令行工具安装是一样的： npm install -g wp2vite or yarn global add wp2vite 使用的话，其实是非常简单的，一个特别特别简单的工具 此时开始为项目创建vite所需的配置，包括package.json里面增加vite相关scripts和devDependencies、vite.config.js的创建、HTML的提取和写入等。
1.4K131发布于 2021-08-18 - 来自专栏全栈开发工程师
【Vite基础】004-Vite 中处理静态资源
【Vite基础】004-Vite 中处理静态资源 一、types 类型 1、url 路径 概述 获取导入文件的路径。 test); export default defineComponent({ setup() { return () =>
Hello Vite test); export default defineComponent({ setup() { return () =>Hello Vite28810编辑于 2025-01-06来自专栏前端自习课【Vite】1934- Vite打包性能优化以及填坑
前言 最近在使用 Vite4.0 构建一个中型前端项目的过程中，遇到了一些坑，也做了一些项目在构建生产环境时的优化，在这里做一个记录，以便后期查阅。 图片压缩 bash 复制代码yarn add vite-plugin-imagemin -D or bash 复制代码npm i vite-plugin-imagemin -D js 复制代码import 上述配置在vite4.0版本生效，如需升级，请前往官方迁移文档。 坑2 Uncaught TypeError: Failed to resolve module specifier "Vue". 我们在项目里面放置了许多json数据(因为业务原因不能上传到服务器)，json数据已经占了差不多5、6mb的原因，所以是一个单纯的项目并没有这么大。 配置 js 复制代码// vite.config.js import { defineConfig } from 'vite' import { createHtmlPlugin } from 'vite-plugin-html
3.2K11编辑于 2024-01-23来自专栏友人a的笔记丶Vite该如何使用？Vite学习笔记，持续记录
defineConfig({ resolve:{ alias:{ '@':resolve('src') } } }) 5. 转码器，可以将 ES6 代码转为 ES5 代码。 5.vite使用PostCss Vite自身已经集成PostCSS，无需再次安装。另外也无需单独创建PostCSS配置文件，已集成到vite.config.js的css选项中。 @vitejs/plugin-vue-jsx 作用：此插件支持在vue3中使用jsx/tsx语法 npm i @vitejs/plugin-vue-jsx 5.vite-plugin-vue-setup-extend () ] } SFC中使用： <script setup lang="ts" name="home"> </script> 5.vite-plugin-cdn-import 作用：用于从 CDN 导入模块
5.1K20编辑于 2023-02-17来自专栏夜梦星尘的折腾日记React 安装（Vite）
前言 Vite 是一个现代化的前端构建工具，旨在通过利用现代浏览器的原生 ES 模块支持，提供快速的开发体验。 Vite 是当前 React 官方推荐的首选工具，比传统的 Create React App 更快、更轻量、开发体验更好。 Vite 基于原生 ES Modules，支持秒级热更新（HMR），启动时间通常只需几百毫秒。 参考：React 安装(Vite) | 菜鸟教程 2. 创建react项目 在目标文件夹中启用powershell，输入下面的命令可以创建指定项目： npm create vite@latest my-first-react-app -- --template react 其中： create vite@latest：使用最新版 Vite 创建工具 my-first-react-app：项目名称 -- --template react：指定 React 模板
26910编辑于 2026-03-05
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号