BestHub
Sign in
Tagged articles
153 articles
Page 1 of 2
Shuge Unlimited
Shuge Unlimited
May 12, 2026 · Frontend Development

Building a Project Skeleton from Scratch with OpenSpec: Full Workflow Walkthrough

This article documents a step‑by‑step OpenSpec workflow that starts with requirement exploration, generates proposal, design, specs, review and task artifacts, executes them to scaffold a React 19 + TypeScript + Vite + Tailwind project, handles GitHub integration, validates the build, and archives the change while sharing practical lessons and pitfalls.

AutomationOpenSpecReact
0 likes · 24 min read
Building a Project Skeleton from Scratch with OpenSpec: Full Workflow Walkthrough
Node.js Tech Stack
Node.js Tech Stack
May 7, 2026 · Frontend Development

Rolldown 1.0 Launches: Up to 30× Faster Than Rollup and 20M Weekly Downloads

Rolldown 1.0, a Rust‑rewritten JavaScript bundler that fully mimics Rollup's API, is now the default engine in Vite 8, delivering 10‑30× speed gains, real‑world build‑time reductions of up to 64%, seamless plugin compatibility, and a roadmap of new features while relying heavily on the Vite ecosystem.

Build PerformanceJavaScript bundlerRolldown
0 likes · 9 min read
Rolldown 1.0 Launches: Up to 30× Faster Than Rollup and 20M Weekly Downloads
Node.js Tech Stack
Node.js Tech Stack
Mar 21, 2026 · Frontend Development

Claude.ai Drops SSR, Embraces Vite—Performance Jumps 65%

Anthropic engineers replaced SSR with a Vite‑based static stack for Claude.ai, deploying to edge workers and achieving a 65% reduction in p75 TTFB and a 50% faster prompt display, while illustrating why SPA‑oriented AI chat apps may forgo server‑side rendering.

Claude AIEdge WorkersSSR
0 likes · 7 min read
Claude.ai Drops SSR, Embraces Vite—Performance Jumps 65%
Sohu Tech Products
Sohu Tech Products
Mar 19, 2026 · Frontend Development

How Void Turns Vite Projects into One‑Click Cloud Deployments

Void is a Vite‑native deployment platform that lets developers enable a plugin, run a single command, and automatically provision Cloudflare Edge, databases, storage, authentication, queues, and AI services, bridging the gap between local development and production with end‑to‑end type safety.

CLICloudflareFull‑stack
0 likes · 9 min read
How Void Turns Vite Projects into One‑Click Cloud Deployments
Full-Stack Cultivation Path
Full-Stack Cultivation Path
Mar 16, 2026 · Frontend Development

Vite+ Launches – A Unified Frontend Development Era Begins

Vite+ has been released as an MIT‑licensed, fully open‑source JavaScript development toolchain that unifies project creation, dependency management, linting, testing, building and monorepo tasks under a single CLI, while remaining compatible with the existing Vite ecosystem.

CLIJavaScriptRust
0 likes · 7 min read
Vite+ Launches – A Unified Frontend Development Era Begins
Node.js Tech Stack
Node.js Tech Stack
Mar 15, 2026 · Frontend Development

Evan You’s Void: Can Vite Finally Match Next.js + Vercel’s Full‑Stack Flow?

Evan You unveiled Void, a Cloudflare‑backed deployment platform and full‑stack SDK built as a Vite plugin, aiming to give Vite‑based projects the seamless development‑to‑deployment experience of Next.js + Vercel, while remaining framework‑agnostic but tightly coupled to Cloudflare, raising questions about lock‑in and ecosystem maturity.

CloudflareFrontend EcosystemFull‑Stack Deployment
0 likes · 10 min read
Evan You’s Void: Can Vite Finally Match Next.js + Vercel’s Full‑Stack Flow?
Node.js Tech Stack
Node.js Tech Stack
Mar 15, 2026 · Frontend Development

Vite+ Goes Open Source: A Unified Frontend Toolchain That Could Redefine Development

Evan You announced that Vite+ is now fully open‑source under the MIT license, offering a single binary ‘vp’ that consolidates building, testing, linting, formatting, and monorepo orchestration, with Rust‑based performance gains of up to 7.7× for builds and 40× faster HMR, while also outlining its team, installation, and early‑stage limitations.

RustVitefrontend toolchain
0 likes · 10 min read
Vite+ Goes Open Source: A Unified Frontend Toolchain That Could Redefine Development
Frontend AI Walk
Frontend AI Walk
Feb 9, 2026 · Frontend Development

Advanced AI Coding: Configuring soul.md and memory.md for a Smarter Assistant

The article explains how to create personal AI profile files (soul.md) and project memory logs (memory.md) to eliminate repetitive introductions, improve code suggestions, and speed up debugging for Vue + Vite developers, with concrete before‑after examples, step‑by‑step configuration for Claude Desktop and OpenCode, and measurable productivity gains.

AI AssistantPrompt engineeringVite
0 likes · 21 min read
Advanced AI Coding: Configuring soul.md and memory.md for a Smarter Assistant
Node.js Tech Stack
Node.js Tech Stack
Feb 5, 2026 · Frontend Development

Evan You Reveals Vite 8 Trick That Supercharges Migration Efficiency

Vite 8 introduces a hidden, AI‑friendly .md view for documentation, letting developers fetch clean Markdown by appending “.md” to URLs, which enables tools like Cursor to automatically parse migration guides, reduce copy‑paste errors, and dramatically cut AI hallucinations while delivering faster builds via Rolldown, Oxc, and Lightning CSS.

AI DocumentationLightning CSSOxc
0 likes · 7 min read
Evan You Reveals Vite 8 Trick That Supercharges Migration Efficiency
Node.js Tech Stack
Node.js Tech Stack
Feb 3, 2026 · Frontend Development

Vue Core Member Anthony Fu Launches 'Skills' Repo, Near 3K Stars, Ushering AI‑Assisted Coding Era

Anthony Fu, a Vue core team member, released the antfu/skills GitHub repository—a curated collection of AI agent skills split into opinionated personal presets and up‑to‑date official documentation, enabling shared, on‑demand prompts for Vue, Nuxt, Vite, and related tools.

AI-assisted codingFrontend toolingGit submodules
0 likes · 5 min read
Vue Core Member Anthony Fu Launches 'Skills' Repo, Near 3K Stars, Ushering AI‑Assisted Coding Era
IT Services Circle
IT Services Circle
Jan 7, 2026 · Frontend Development

Why Vite 8 Marks a Fundamental Shift in Frontend Build Tools

The article examines Vite's evolution from a clever dev‑experience enhancer using esbuild and Rollup to a fully re‑architected platform with Rolldown, Oxc, and a shared AST, explaining how these changes reflect a deeper strategic move toward a self‑contained, stable, and sustainable frontend infrastructure.

Build ToolBundlerJavaScript
0 likes · 6 min read
Why Vite 8 Marks a Fundamental Shift in Frontend Build Tools
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 28, 2025 · Frontend Development

How to Collaborate with AI to Build a Complete UnoCSS Setup for UniApp Vue3 Projects

This article demonstrates a step‑by‑step, multi‑round dialogue with the AI assistant TRAE SOLO to progressively configure UnoCSS for a UniApp + Vue3 + Vite project, covering initial planning, dependency installation, platform‑specific fixes, shortcut creation, dynamic class handling, and component development.

AI CollaborationConfigurationUniapp
0 likes · 18 min read
How to Collaborate with AI to Build a Complete UnoCSS Setup for UniApp Vue3 Projects
Sohu Tech Products
Sohu Tech Products
Dec 17, 2025 · Frontend Development

How Frontend Engineering Evolved: Choosing Between Webpack, Vite, and Rspack

This article traces the evolution of frontend engineering from static pages to modern modular workflows, explains the core responsibilities of bundlers, compares Webpack, Vite, and Rspack in terms of architecture, performance, configuration complexity, and ecosystem, and offers guidance on selecting the right tool for a project.

RspackVitebundling
0 likes · 23 min read
How Frontend Engineering Evolved: Choosing Between Webpack, Vite, and Rspack
大转转FE
大转转FE
Dec 15, 2025 · Frontend Development

From Static Pages to Modern Bundlers: How Webpack, Vite, and Rspack Evolve Frontend Engineering

This article traces the evolution of frontend engineering from static HTML pages to modular development, explains the core responsibilities of bundlers, compares Webpack, Vite, and Rspack in terms of architecture, performance, configuration complexity, and ecosystem support, and offers guidance on selecting the right tool for a project.

EngineeringRspackVite
0 likes · 24 min read
From Static Pages to Modern Bundlers: How Webpack, Vite, and Rspack Evolve Frontend Engineering
IT Services Circle
IT Services Circle
Dec 4, 2025 · Frontend Development

Why Vite 8’s Switch to Rolldown Could Boost Your Build Speed 10‑30×

Vite 8 Beta replaces its esbuild‑Rollup pipeline with the Rust‑based Rolldown, unifying the toolchain and delivering 10‑30× faster builds, flexible code‑splitting, module‑level caching, and upcoming Full Bundle mode, while offering optional tsconfig.paths, emitDecoratorMetadata support and a low‑cost migration path for large projects.

Frontend BuildJavaScriptRolldown
0 likes · 5 min read
Why Vite 8’s Switch to Rolldown Could Boost Your Build Speed 10‑30×
JavaScript
JavaScript
Dec 1, 2025 · Frontend Development

How Vue’s Upcoming Vapor Mode Could Revolutionize Frontend Performance

The article outlines Vue’s next‑generation Vapor Mode—a compilation strategy that removes the virtual DOM, introduces fine‑grained reactive tracking, and promises faster updates, smaller bundles, and a smoother developer experience for the anticipated Vue 4.0 release.

JavaScriptReactive SystemVapor Mode
0 likes · 5 min read
How Vue’s Upcoming Vapor Mode Could Revolutionize Frontend Performance
21CTO
21CTO
Nov 3, 2025 · Frontend Development

Vite+ Unveiled: A Rust‑Powered JavaScript Toolchain Backed by $12.5M Funding

VoidZero Inc., founded by Evan You, announced Vite+, a Rust‑based, high‑performance JavaScript toolchain that unifies build, test, and deployment workflows, secured a $12.5 million Series A round led by Accel, and outlined ambitious plans for rapid ecosystem growth.

Evan YouJavaScript toolchainSeries A Funding
0 likes · 5 min read
Vite+ Unveiled: A Rust‑Powered JavaScript Toolchain Backed by $12.5M Funding
Full-Stack Cultivation Path
Full-Stack Cultivation Path
Sep 25, 2025 · Frontend Development

Vite 7 Just Stabilized—Is Vite 8 Already on the Horizon?

The article reviews Vite 8’s rapid rollout, highlighting its Rust‑based Rolldown bundler, dramatic build‑time reductions (120 s to 8 s), enhanced tree‑shaking, native Import Maps, and migration steps, positioning Vite 8 as a new performance baseline for modern frontend toolchains.

Frontend BuildImport MapsModule Federation
0 likes · 7 min read
Vite 7 Just Stabilized—Is Vite 8 Already on the Horizon?
Instant Consumer Technology Team
Instant Consumer Technology Team
Sep 23, 2025 · Artificial Intelligence

What’s Driving the Latest Tech Frontier? Vite’s Speed Boost, AI Coding Agents, and End‑to‑End Generative Search

This roundup highlights Vite’s next‑gen Rolldown engine delivering up to 45% faster builds, AI‑powered coding tools like Comate Zulu and Claude Code enabling solo developers, Browser‑Use’s AI web automation, Alipay’s AI travel assistant built by a four‑person team, ROMA’s dark‑mode adaptation, Kuaishou’s OneSearch generative framework, MIDAS multimodal digital‑human breakthroughs, and the open‑source VoxCPM speech model.

AI CodingBrowser AutomationGenerative Search
0 likes · 6 min read
What’s Driving the Latest Tech Frontier? Vite’s Speed Boost, AI Coding Agents, and End‑to‑End Generative Search
Sohu Tech Products
Sohu Tech Products
Sep 10, 2025 · Frontend Development

Boost Your Vue3 Projects: Essential Tools and Quick Start Guides

Discover how to rapidly launch Vue3 applications using create‑vue, Nuxt, uni‑app, electron‑vite, and essential libraries like Vue Router, Pinia, VueUse, VeeValidate, UnoCSS, and UI frameworks, while also learning debugging, testing, and static site generation techniques for modern frontend development.

ToolingUI componentsVite
0 likes · 15 min read
Boost Your Vue3 Projects: Essential Tools and Quick Start Guides
IT Services Circle
IT Services Circle
Jul 12, 2025 · Frontend Development

What’s New in Vite 7.0? Core Modernization, Rolldown, and DevTools

Vite 7.0 introduces major performance upgrades, a Rust‑based bundler called Rolldown, updated Node.js and browser targets, experimental Environment API hooks, and a new DevTools suite, marking a shift from a simple build tool to a full‑stack frontend platform.

DevToolsESMFrontend Build Tools
0 likes · 5 min read
What’s New in Vite 7.0? Core Modernization, Rolldown, and DevTools
IT Services Circle
IT Services Circle
May 17, 2025 · Frontend Development

Essential Vue3 Ecosystem Tools and Their Installation Guides

This article introduces a curated collection of Vue 3 ecosystem tools—including create‑vue, TypeScript support, vue‑router, Pinia, Vite, VueUse, ESLint/Prettier, UnoCSS, UI component libraries, debugging plugins, uni‑app, electron integration, VitePress, and Nuxt—providing concise descriptions and npm installation commands to help developers quickly set up modern front‑end projects.

NuxtToolingTypeScript
0 likes · 8 min read
Essential Vue3 Ecosystem Tools and Their Installation Guides
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Apr 26, 2025 · Frontend Development

Decentralized Micro‑Frontend Architecture with Vite Module Federation in Vue 3

This article explains how to build a decentralized micro‑frontend system for Vue 3 using the Vite‑based @originjs/vite-plugin-federation, covering architecture concepts, configuration, dynamic module loading, shared routing, state management with Pinia, and deployment strategies, complete with code examples.

Dynamic LoadingModule FederationVite
0 likes · 15 min read
Decentralized Micro‑Frontend Architecture with Vite Module Federation in Vue 3
Full-Stack Cultivation Path
Full-Stack Cultivation Path
Apr 11, 2025 · Frontend Development

A Fast, Efficient Vue3 3D Development Solution with TresJS

This article introduces TresJS, a Vue‑based declarative wrapper for Three.js that streamlines 3D scene creation, outlines its core features, suitable use cases, provides a quick‑start guide with Vite configuration and sample code, and lists lab utilities and resources.

3DThree.jsTresJS
0 likes · 5 min read
A Fast, Efficient Vue3 3D Development Solution with TresJS
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Apr 8, 2025 · Frontend Development

auto-i18n-translation-plugins: Automatic Internationalization for Frontend Projects

This article introduces the auto-i18n-translation-plugins, a framework‑agnostic Vite/Webpack plugin that automatically extracts Chinese text from source code, replaces it with hash‑based $t calls, generates language packs, and seamlessly translates new or incremental strings using configurable translators such as Youdao or Google.

AutomationVitei18n
0 likes · 18 min read
auto-i18n-translation-plugins: Automatic Internationalization for Frontend Projects
Full-Stack Cultivation Path
Full-Stack Cultivation Path
Mar 27, 2025 · Frontend Development

How Vite + AI Can Boost Development Efficiency by 200%

The article explains how Vite’s native ES‑module architecture and the Model Context Protocol (MCP) enable deep AI integration via the vite‑plugin‑vue‑mcp, allowing tools like Cursor to access component trees, state and routing, which the author claims can raise development speed by up to 200% and cut bugs by 65%.

AI integrationCursorFrontend tooling
0 likes · 6 min read
How Vite + AI Can Boost Development Efficiency by 200%
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Mar 13, 2025 · Frontend Development

auto-i18n-translation-plugins: A Full-Automatic Frontend Internationalization Plugin for Vite and Webpack

The article introduces auto‑i18n‑translation‑plugins, a Babel‑based automatic internationalization plugin for frontend projects that works with Vite and Webpack, detailing its features, installation, configuration options, translator setup, usage examples, and best practices for generating multilingual JSON translation files without modifying business code.

Vitei18ntranslation
0 likes · 13 min read
auto-i18n-translation-plugins: A Full-Automatic Frontend Internationalization Plugin for Vite and Webpack
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Feb 9, 2025 · Frontend Development

Managing and Optimizing Import Statements in Frontend Projects

This article explains why import statements can fill an entire file, examines the problems caused by excessive imports, and presents practical techniques such as module re‑export, require.context, dynamic import, webpack ProvidePlugin, Vite plugins, TypeScript namespaces, aliasing, and Babel plugins to keep import sections concise and maintainable.

ImportVitecode organization
0 likes · 11 min read
Managing and Optimizing Import Statements in Frontend Projects
php Courses
php Courses
Feb 5, 2025 · Frontend Development

Integrating Vue.js with Laravel Using Vite: A Step‑by‑Step Guide

This tutorial walks you through setting up a Laravel project, installing Laravel Breeze, configuring Vite for Vue.js, creating a TaskList component, registering it in the Blade template, and running the development server to see a responsive Vue‑driven task manager.

LaravelPHPVite
0 likes · 6 min read
Integrating Vue.js with Laravel Using Vite: A Step‑by‑Step Guide
21CTO
21CTO
Jan 26, 2025 · Frontend Development

What’s New in Tailwind CSS 4.0? Faster Builds, Oxide Engine, and Modern Features

Tailwind CSS 4.0 introduces a dramatically faster Oxide build engine, new CSS capabilities like cascade layers and Oklch colors, Vite‑optimized tooling, and stricter browser requirements, while offering a simple import‑based setup and detailed migration guidance for developers.

Build PerformanceCSS FrameworkTailwind CSS
0 likes · 6 min read
What’s New in Tailwind CSS 4.0? Faster Builds, Oxide Engine, and Modern Features
大转转FE
大转转FE
Jan 21, 2025 · Frontend Development

code‑inspector‑plugin: A Frontend Development Tool for Fast Source‑Code Location and IDE Integration

The article introduces code‑inspector‑plugin, an open‑source plugin for bundlers like webpack, Vite, and Rspack that lets developers click a DOM element in the browser to instantly open the corresponding source file in their IDE, detailing installation, configuration, usage, implementation principles, and common troubleshooting tips.

IDE integrationVitecode-inspector
0 likes · 24 min read
code‑inspector‑plugin: A Frontend Development Tool for Fast Source‑Code Location and IDE Integration
DevOps
DevOps
Jan 20, 2025 · Frontend Development

Top Frontend Open‑Source Projects to Watch in 2025

This article reviews seven leading front‑end open‑source projects for 2025—Vite, Bun, React 19, Next.js 15, Solid.js, Tailwind CSS, and Astro—highlighting their key features, integration capabilities, and ideal use‑cases for modern web development.

BunNext.jsTailwindCSS
0 likes · 8 min read
Top Frontend Open‑Source Projects to Watch in 2025
IT Services Circle
IT Services Circle
Dec 30, 2024 · Frontend Development

Automatically Import Vue and Vite APIs with unplugin-auto-import

This article explains how to use the unplugin-auto-import plugin to automatically import Vue core functions, Naive UI components, and other libraries in a Vue 3 + Vite + TypeScript project, reducing repetitive import statements and improving code readability.

TypeScriptViteVue
0 likes · 5 min read
Automatically Import Vue and Vite APIs with unplugin-auto-import
Ctrip Technology
Ctrip Technology
Dec 12, 2024 · Frontend Development

Upgrading Remix from 1.0 to 2.0: Solving Vite DynamicImport Preload Issues and Custom Optimizations

This article details the Ctrip Travel front‑end team's experience upgrading their framework from Remix 1.0 to Remix 2.0, focusing on Vite's DynamicImport optimization that caused 404 resource loads, and explains the mechanisms, code transformations, and custom fixes they implemented to ensure proper modulepreload and CDN host injection.

DynamicImportModulePreloadRemix
0 likes · 34 min read
Upgrading Remix from 1.0 to 2.0: Solving Vite DynamicImport Preload Issues and Custom Optimizations
IT Services Circle
IT Services Circle
Dec 2, 2024 · Frontend Development

Vite 6.0 Release: New Environment API, Updated Defaults, and Growing Ecosystem

Vite 6.0 launched on November 26, boosting weekly npm downloads to 17 million, introducing an experimental Environment API for multi‑environment support, updating defaults for resolve conditions, JSON handling, HTML resources, and Sass, while expanding its ecosystem with new frameworks and major company adoption.

Build ToolEnvironment APIJavaScript
0 likes · 5 min read
Vite 6.0 Release: New Environment API, Updated Defaults, and Growing Ecosystem
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 24, 2024 · Frontend Development

Integrating Unocss Icon Solution into a Vite Vue Project

This tutorial introduces common icon approaches, explains the Unocss icon scheme built on SVG and Iconify, and provides step‑by‑step instructions—including Vite project setup, configuration files, and usage examples—to help front‑end developers efficiently add scalable, color‑aware icons to Vue applications.

CSS IconsUnoCSSVite
0 likes · 8 min read
Integrating Unocss Icon Solution into a Vite Vue Project
JD Tech Talk
JD Tech Talk
Oct 23, 2024 · Frontend Development

Master CSS Engineering in Vite: Global Styles, Modules, and Windi CSS

This guide explains how to improve CSS maintainability and performance in Vite projects by adding global SCSS variables, using CSS Modules, configuring PostCSS autoprefixer, and integrating the Windi CSS atomic framework with attributify and shortcuts, complete with code examples.

CSS EngineeringCSS ModulesVite
0 likes · 7 min read
Master CSS Engineering in Vite: Global Styles, Modules, and Windi CSS
21CTO
21CTO
Oct 7, 2024 · Frontend Development

How Evan You’s VoidZero Aims to Unify the JavaScript Toolchain

Evan You, the creator of Vue.js, announced his new company VoidZero, which plans to build a unified, high‑performance JavaScript toolchain that addresses Vite’s limitations, introduces shared ASTs, common parsers, and faster bundlers like Rolldown, while already securing significant seed funding and industry adoption.

BundlerJavaScriptToolchain
0 likes · 9 min read
How Evan You’s VoidZero Aims to Unify the JavaScript Toolchain
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Sep 26, 2024 · Frontend Development

Step‑by‑Step Guide to Building a Vite‑Based Vue Component Library with Custom Build and TypeScript Support

This article walks through creating a Vue component library using Vite, reorganizing the project structure, configuring aliases, writing reusable components with a global install helper, setting up routing, customizing Vite build outputs, generating TypeScript declarations, and documenting the library with VitePress.

Component LibraryTypeScriptVite
0 likes · 13 min read
Step‑by‑Step Guide to Building a Vite‑Based Vue Component Library with Custom Build and TypeScript Support
JD Tech Talk
JD Tech Talk
Sep 25, 2024 · Frontend Development

Migrating a Webpack Project to Vite Using the Golden Circle Framework

This article explains why and how to migrate a large Vue 2 Webpack codebase to Vite, applying Simon Sinek's Golden Circle model to clarify motivation, method, and concrete steps, and demonstrates the resulting dramatic reduction in build time and bundle size.

ViteVue2build tools
0 likes · 13 min read
Migrating a Webpack Project to Vite Using the Golden Circle Framework
JD Cloud Developers
JD Cloud Developers
Sep 25, 2024 · Frontend Development

How to Migrate a Large Webpack Project to Vite and Cut Build Time by 98%

This article explains why and how to migrate a complex Webpack‑based frontend project to Vite, using Simon Sinek's Golden Circle model, and details the step‑by‑step migration process, configuration changes, code snippets, and the resulting dramatic performance improvements.

Build OptimizationGolden CircleVite
0 likes · 13 min read
How to Migrate a Large Webpack Project to Vite and Cut Build Time by 98%
JD Tech
JD Tech
Sep 18, 2024 · Frontend Development

Migrating a Webpack Project to Vite: A Golden Circle Approach

This article explains how to apply Simon Sinek's Golden Circle framework to migrate a large‑scale Webpack‑based frontend project to Vite, detailing the motivations, the faster development experience, step‑by‑step migration procedures, configuration adjustments, and the resulting performance improvements.

JavaScriptPerformance OptimizationVite
0 likes · 13 min read
Migrating a Webpack Project to Vite: A Golden Circle Approach
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Aug 20, 2024 · Frontend Development

Understanding Vite: What It Is, How It Works, and Its Differences from Webpack

This article explains what Vite is, distinguishes it from traditional scaffolding tools, details its underlying build‑tool principles, compares Vite with Webpack, and walks through its core architecture, plugin system, hot‑module replacement, and why it offers fast, on‑demand development experiences.

Build ToolHot Module ReplacementVite
0 likes · 24 min read
Understanding Vite: What It Is, How It Works, and Its Differences from Webpack
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Aug 18, 2024 · Frontend Development

Step‑by‑Step Guide to Integrating ESLint into Vue 3 and Other Front‑End Projects

This article explains why ESLint is essential for front‑end code quality, describes its core features, and provides a detailed five‑step process for integrating ESLint into Vue 3 projects, followed by deeper integration techniques for Vite, Webpack, CI/CD pipelines, Git hooks, and IDEs, complete with practical code examples and troubleshooting tips.

ESLintViteVue
0 likes · 18 min read
Step‑by‑Step Guide to Integrating ESLint into Vue 3 and Other Front‑End Projects
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Aug 18, 2024 · Frontend Development

Persisting Frontend Static Resources in Containerized Deployments

The article explains why static assets of a single‑page frontend application disappear after a container restart, analyzes the root cause, and presents a practical solution that stores assets on an external file server or CDN while keeping only index.html inside the container, thereby eliminating 404 errors caused by missing resources.

CDNVitecontainerization
0 likes · 13 min read
Persisting Frontend Static Resources in Containerized Deployments
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jul 26, 2024 · Frontend Development

Step-by-Step Guide to Building and Packaging an Electron Desktop Application with Vue 3 and Vite

This tutorial walks through creating a cross‑platform Electron desktop app using Vue 3 and Vite, covering project setup, Electron installation, configuration of .npmrc and plugins, writing the main process, Vite plugin integration, package.json adjustments, building, Windows and Linux packaging, NSIS installer options, and adding Vue router for navigation.

Desktop ApplicationElectronVite
0 likes · 13 min read
Step-by-Step Guide to Building and Packaging an Electron Desktop Application with Vue 3 and Vite
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jul 21, 2024 · Frontend Development

A Lightweight Vue 3 + Element‑plus Admin Dashboard Template: Setup, Configuration, and Usage

This article introduces a lightweight admin dashboard template built with Vue 3.4, Element‑plus, and Vite, detailing its project structure, technology stack, coding standards, configuration files, component integrations such as UnoCSS, mock.js, canvas, SVG and WangEditor, and provides step‑by‑step commands for development, linting, formatting, and production build.

Element-plusMock.jsTypeScript
0 likes · 15 min read
A Lightweight Vue 3 + Element‑plus Admin Dashboard Template: Setup, Configuration, and Usage
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jun 16, 2024 · Frontend Development

Step‑by‑Step Guide to Building a Vue 3 Headless UI Component Library with pnpm, Vite, and TypeScript

This article provides a comprehensive, hands‑on tutorial for creating a Vue 3 Headless UI component library, covering project initialization, workspace configuration, ESLint and Git‑hook setup, TypeScript and Vite integration, unit testing with Vitest, documentation with VitePress, playground creation, monorepo building, and publishing to npm.

Component LibraryDocumentationMonorepo
0 likes · 17 min read
Step‑by‑Step Guide to Building a Vue 3 Headless UI Component Library with pnpm, Vite, and TypeScript
php Courses
php Courses
May 31, 2024 · Frontend Development

Integrating Vue.js with Vite in a Laravel Project: Step‑by‑Step Tutorial

This comprehensive tutorial walks you through installing prerequisites, creating a new Laravel project, optionally adding Laravel Breeze, configuring Vite, building a Vue component, updating the Blade view, compiling assets, and finally serving the application to see a live Vue component rendered within Laravel.

LaravelViteVue.js
0 likes · 6 min read
Integrating Vue.js with Vite in a Laravel Project: Step‑by‑Step Tutorial
HelloTech
HelloTech
May 16, 2024 · Frontend Development

Vite Legacy Plugin for Browser Compatibility

The Vite Legacy Plugin adds browser compatibility to Vite projects by using Babel to transpile modern JavaScript, generating polyfill chunks, and offering configurable target browsers, while allowing developers to control whether legacy or modern bundles are produced through dedicated config, generation, and post‑build plugins.

LegacyPolyfillVite
0 likes · 5 min read
Vite Legacy Plugin for Browser Compatibility
Architecture Digest
Architecture Digest
Apr 25, 2024 · Frontend Development

Douyin Open-Source Short Video Project – Overview and Setup Guide

This article introduces the Douyin open‑source short‑video project built with Vue and Vite, provides a free book giveaway link, and gives step‑by‑step instructions for installing Node, cloning the repository, installing dependencies with pnpm, and running the application locally.

ViteVuefrontend
0 likes · 3 min read
Douyin Open-Source Short Video Project – Overview and Setup Guide
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Apr 2, 2024 · Frontend Development

Understanding Vite’s Development Server, Plugin System, and Pre‑Bundling Mechanism

This article explains how Vite speeds up frontend development by serving unbundled ES modules, using a plugin‑based transform pipeline, performing on‑the‑fly compilation, pre‑bundling dependencies with esbuild, and finally leveraging Rollup for production builds while maintaining consistent behavior across dev and prod environments.

ESMHot Module ReplacementRollup
0 likes · 9 min read
Understanding Vite’s Development Server, Plugin System, and Pre‑Bundling Mechanism
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Mar 29, 2024 · Frontend Development

Exploring Modern Front‑End Techniques: Chrome Extensions, Vite, Husky, and HTTP/3

This article surveys current front‑end innovations, covering Chrome extension development, using Husky for Git‑hook scripts, the clever architecture of Vite, new JavaScript operators (?., ??, ??=), the upcoming HTTP/3 protocol, 2024 front‑end technology trends, and an invitation to join a leading front‑end team.

2024 trendsChrome extensionsHTTP/3
0 likes · 4 min read
Exploring Modern Front‑End Techniques: Chrome Extensions, Vite, Husky, and HTTP/3
IT Services Circle
IT Services Circle
Mar 29, 2024 · Frontend Development

Understanding Vite’s Development Server Architecture and Pre‑bundling Mechanism

Vite accelerates development by serving unbundled ES modules directly to the browser, using a connect‑based dev server that compiles on‑demand, leverages esbuild for fast pre‑bundling of dependencies, generates hash‑based cache queries, and shares plugins with Rollup for consistent production builds.

Hot Module ReplacementPre‑bundlingVite
0 likes · 9 min read
Understanding Vite’s Development Server Architecture and Pre‑bundling Mechanism
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Mar 19, 2024 · Frontend Development

City Data Visualization Demo with Three.js, Vite, and TypeScript

This article presents a step‑by‑step guide for building an interactive 3D city data visualization using Vite, TypeScript, and Three.js, covering model loading, scene centering, fly‑line generation, line‑drawing, CSS2D overlays, camera presets, and custom shaders with complete code examples.

3d-visualizationTypeScriptVite
0 likes · 18 min read
City Data Visualization Demo with Three.js, Vite, and TypeScript
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Feb 4, 2024 · Frontend Development

Understanding Vue Form Validation, Scoped Data Attributes, Build Output, Remote Component Loading, and Render‑Function Dropdown

This article explains the principles and implementation details of Vue form validation, the generation of scoped data‑v‑xxx attributes, the composition of build output files, remote loading of .vue components, and how to create a dropdown menu using the render function, providing code examples and step‑by‑step explanations.

Dynamic ComponentScoped CSSVite
0 likes · 17 min read
Understanding Vue Form Validation, Scoped Data Attributes, Build Output, Remote Component Loading, and Render‑Function Dropdown
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 25, 2023 · Frontend Development

Comprehensive Guide to Building a Vue3 + Vite + TypeScript Project with Permission Management, Component Encapsulation, and Build Optimization

This article presents a step‑by‑step tutorial for creating a Vue 3 project using Vite and TypeScript, covering project scaffolding, routing and permission control, reusable component and directive encapsulation, custom hooks, Axios configuration, build optimization techniques, and essential TypeScript concepts.

Build OptimizationComponent EncapsulationVite
0 likes · 19 min read
Comprehensive Guide to Building a Vue3 + Vite + TypeScript Project with Permission Management, Component Encapsulation, and Build Optimization
IT Xianyu
IT Xianyu
Dec 18, 2023 · Frontend Development

Geeker-Admin: Open‑Source Vue3‑Based Backend Management Framework

Geeker-Admin is an open‑source admin panel built with Vue 3.3, TypeScript, Vite 5, Pinia and Element‑Plus, offering a rich ProTable component, dynamic routing, theme switching, i18n, extensive custom directives, and full linting and commit tooling for rapid frontend development.

TypeScriptViteVue
0 likes · 4 min read
Geeker-Admin: Open‑Source Vue3‑Based Backend Management Framework
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 18, 2023 · Frontend Development

Evolution of Varlet UI: Architecture, Monorepo, Design System, and Tooling in 2023

In this article the author, creator of the Vue3 mobile component library Varlet UI, shares the latest architectural changes, monorepo setup, design system, development tooling, testing, build outputs, documentation deployment, playground, and VSCode extensions, reflecting on lessons learned over the past two years.

Component LibraryViteVue
0 likes · 12 min read
Evolution of Varlet UI: Architecture, Monorepo, Design System, and Tooling in 2023
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Dec 12, 2023 · Frontend Development

Deep Dive into Vite's Dependency Pre‑Bundling Process

This article explains why Vite is faster than bundlers like Webpack, introduces the concept of dependency pre‑bundling, walks through its implementation using esbuild plugins, and shows how to build a simplified custom Vite server that scans, resolves, and pre‑bundles third‑party modules.

JavaScriptPre‑bundlingVite
0 likes · 35 min read
Deep Dive into Vite's Dependency Pre‑Bundling Process
Huolala Tech
Huolala Tech
Nov 7, 2023 · Frontend Development

Why Does My Vue App Show a White Screen on Old Android Devices? Fixing Vite Legacy Compatibility

This article uses a fictional story to illustrate a front‑end white‑screen problem on an old Android phone, analyzes the root causes such as unsupported Chrome versions, missing globalThis and Vue loading failures, and provides a step‑by‑step Vite legacy downgrade solution with code examples and configuration tips.

CompatibilityLegacyVite
0 likes · 15 min read
Why Does My Vue App Show a White Screen on Old Android Devices? Fixing Vite Legacy Compatibility
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Nov 3, 2023 · Frontend Development

Modern Frontend Insights: SVG, Code Standards, Next.js SQL, Vite, Node.js 21

This article surveys recent frontend developments, including detailed SVG rendering techniques, best‑practice code standards with ESLint, Prettier and Husky, emerging trends such as Next.js‑embedded SQL, Vite’s roadmap and Node.js 21’s Stream API upgrades, plus practical UX guidance for legacy browsers and a glimpse of a leading frontend team.

ESLintNext.jsSVG
0 likes · 3 min read
Modern Frontend Insights: SVG, Code Standards, Next.js SQL, Vite, Node.js 21
Sohu Tech Products
Sohu Tech Products
Oct 25, 2023 · Frontend Development

Using Vite with Remix: Installation, Configuration, and Feature Guide

This guide explains how to add the experimental Vite bundler to a Remix project—installing Vite, creating a vite.config.ts with the Remix plugin, configuring TypeScript, path aliases, CSS imports, Tailwind, vanilla‑extract, MDX, and noting differences such as LiveReload placement, Fast Refresh constraints, and current feature support across environments.

ConfigurationJavaScriptMDX
0 likes · 16 min read
Using Vite with Remix: Installation, Configuration, and Feature Guide
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Oct 19, 2023 · Frontend Development

Integrating Monorepo with Micro‑Frontend Using pnpm and Micro‑App: Architecture, Implementation, and Deployment

This article explains how to combine Monorepo and micro‑frontend architectures using pnpm and Micro‑App, covering the concepts, technical selections, step‑by‑step setup of base and child applications, shared modules, configuration, code standards, mock services, Docker/Nginx deployment, and best practices for frontend development.

MonorepoVitefrontend
0 likes · 35 min read
Integrating Monorepo with Micro‑Frontend Using pnpm and Micro‑App: Architecture, Implementation, and Deployment
JD Retail Technology
JD Retail Technology
Oct 16, 2023 · Frontend Development

MicroApp 1.0: Faster Sandbox and Virtual Routing for Micro‑Frontend Development

MicroApp 1.0 introduces a streamlined micro‑frontend framework with a simplified integration method, a high‑performance sandbox using variable pre‑placement and async debounce, a virtual routing system that isolates sub‑app navigation, upgraded CSS isolation, Vite compatibility, and a Chrome DevTools extension for enhanced debugging.

DevToolsVitefrontend framework
0 likes · 10 min read
MicroApp 1.0: Faster Sandbox and Virtual Routing for Micro‑Frontend Development
JD Retail Technology
JD Retail Technology
Aug 30, 2023 · Frontend Development

Building a ChatGPT-Powered Chrome Extension for Word Translation

This tutorial walks through creating a Chrome extension that uses the ChatGPT API to translate selected text, covering setup with OpenAI's quickstart, key code snippets for prompts, content‑script and background service worker, Vite plugin usage, deployment on Vercel, and runtime considerations.

APIChatGPTChrome Extension
0 likes · 5 min read
Building a ChatGPT-Powered Chrome Extension for Word Translation
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Aug 5, 2023 · Frontend Development

Second‑Level (秒级) Front‑End Rollback: A Step‑by‑Step Demo Using Vite, React, and Node

This article presents a complete tutorial for implementing a near‑instant (second‑level) rollback mechanism for single‑page front‑end applications, covering the underlying idea, project setup with Vite and React, history recording, a lightweight Node server, and a petite‑Vue visual interface for selecting and applying previous builds.

DeploymentNodeReact
0 likes · 20 min read
Second‑Level (秒级) Front‑End Rollback: A Step‑by‑Step Demo Using Vite, React, and Node
HomeTech
HomeTech
May 10, 2023 · Frontend Development

Comprehensive Guide to H5 Page Load Performance Optimization

This article details comprehensive strategies for accelerating H5 page load times, covering background analysis, performance metrics, loading strategies, preload/prefetch, DNS prefetch, preconnect, skeleton screens, image compression with WebP, CDN caching, bundle optimization with Vite/Webpack, and provides practical code examples and configuration snippets.

H5Viteoptimization
0 likes · 15 min read
Comprehensive Guide to H5 Page Load Performance Optimization
Sohu Tech Products
Sohu Tech Products
Apr 26, 2023 · Frontend Development

Customizing console.log Styles and Building a Console Log Button NPM Library

This article demonstrates how to style console.log output using %c placeholders, outlines the supported CSS properties, and walks through creating a lightweight, Vue‑devtool‑inspired log‑button library with Vite, TypeScript, ESLint, Husky, and ChatGPT‑generated UI color palettes, culminating in publishing the package to npm.

Viteconsolefrontend
0 likes · 14 min read
Customizing console.log Styles and Building a Console Log Button NPM Library
Qborfy AI
Qborfy AI
Apr 6, 2023 · Frontend Development

How to Build a Vue‑Powered Chrome Extension with Vite and Rollup

This guide walks through creating a Chrome extension using Vue and Vite, covering project initialization, multi‑entry Rollup configuration for background scripts, UI development with tdesign‑vue‑next, debugging hash‑related loading issues, and final deployment steps.

Chrome ExtensionRollupVite
0 likes · 8 min read
How to Build a Vue‑Powered Chrome Extension with Vite and Rollup
ByteFE
ByteFE
Mar 29, 2023 · Frontend Development

Understanding Frontend Bundling, Module Systems, and the Rise of Bundle‑less Development

This article explains why frontend projects historically needed bundling, describes the evolution of module systems such as CommonJS, AMD, CMD, and ESM, compares bundlers like Webpack and Rollup, and introduces bundle‑less tools like Vite that leverage native ES modules to improve development experience and performance.

BundlelessVitebundling
0 likes · 13 min read
Understanding Frontend Bundling, Module Systems, and the Rise of Bundle‑less Development
DaTaobao Tech
DaTaobao Tech
Mar 27, 2023 · Frontend Development

Building a Vue + SpringBoot Management System: Setup, Architecture, and Deployment

This step‑by‑step guide shows backend developers how to create a small management system with Vue 3, TypeScript, Vite, and SpringBoot, covering the technology stack, development‑tool installation, project scaffolding, core components, routing, Pinia state, Axios API wrappers, TypeScript interfaces, environment configuration, and deployment.

SpringBootTypeScriptVite
0 likes · 22 min read
Building a Vue + SpringBoot Management System: Setup, Architecture, and Deployment