接上一篇Webpack优化之后，现在和小伙伴们一起来聊一聊Vite，聊的主要内容是为什么选用Vite和Vite的使用规则。 我第一次使用Vite是去年4月份的时候，当时上海正在封控中，同时公司开始筹备做一...

背景 项目过程中，你是否每加一个页面，都要添加路由的的烦恼？ 你是否想每加一个.vue文件，自动生成路由文件呢？ 下面这个插件，就可以解决你的这些烦恼。 安装 #Npm npm i -D unplugin-vue-ro...

大家好，我是苏先生，一名热爱钻研、乐于分享的前端工程师，跟大家分享一句我很喜欢的话：人活着，其实就是一种心态，你若觉得快乐，幸福便无处不在 github与好文 TypeScript知识点和99个类型体...

前言 之前开源了 babel-plugin-enhance-log，也通过写了文章偏爱 console.log 的你，肯定会觉得这个插件泰裤辣！来分享该插件如何使用，不过，看到评论里面有好几个都在问 vite+vue 如何使用： ...

我们都知道，vite 在开发时使用的是 esbuild 作为依赖预构建和 ts、jsx 文件转译工具，通过浏览器的 ESM 加载，而在生产打包时使用的是 Rollup 作为打包工具。这样的双引擎架构可以同时享受到到...

ElectronChatGPT 一款桌面端仿制chatgpt聊天模板项目。 使用最新前端vite4/vue3全家桶技术整合electron电脑端技术实现仿制chatgpt会话聊天程序。支持经典+分栏两种布局、暗黑+明亮主题、多窗口...

本文只是笔者作为一个初学者，在学习中与看了诸多业界的优秀实践文章之后的思考和沉淀，如果你在看的过程中觉得有些不妥的地方，可以随时和我联系，一起探讨学习。 提到 Vite，第一个想到的字就...

一、less、css、sass不生效问题。 方案1 less或者css，sass需要用到模块化的话，后缀名全部要加上《module》如*.module.less。否则不会生效 import styles from './index.module.less'; <div...

什么是开发工具 这里说的开发工具不是指电脑硬件或者代码编辑器（例如 VS Code），而是前端工具链、或者说项目脚手架，其核心的功能基本类似，大致包含： 使用模板创建项目初始目录和文件 管理...

背景 写这个工具的起因是因为公司一些新建项目的时候都会从老的项目中cv一套出来，然后把里面的代码删掉，重新在这个基础上开发。这样造成了很多的问题，比如1. 上一个代码并没有删除完全，很多...

前言 不管是unocss还是tailwindcss和windicss，默认的单位都是rem，这有一定的设计理念，但其实这对于习惯使用px单位的人来说不太友好，有相当一部分人因为这点而放弃使用原子化css 那么，有没...

在尤大的带领下，在社区的共同努力下，现在vite的发展可谓是日新月异，在这种大势所趋下，了解vite，并且掌握vite是势在必行的，所以今天稍微讲解下vite及其配置详情；Vite 的快，主要体现在两...

一、vite的插件推荐 rollup-plugin-visualizer 打包分析插件 安装 npm install rollup-plugin-visualizer -D vite配置 // vite.config.js import { defineConfig } from 'vite' import { visual...

创建项目 进入项目目录，运行 yarn create vite 然后根据提示输入项目名，然后依次选择 Vue、TypeScript 即可创建一个简单的 Vue3+TS 项目。创建后按照提示进入项目文件夹并安装依赖，然后运...