首页
博客
源码
资源
博客
源码
写文章
发布博客
发布资源
登录
X
vite
相关资讯
热门
最新
代码人生
01-01 08:00
代码人生
Vite 源码(五)浏览器访问 `localhost:3000/` 时,Vite做了什么
Vite 源码(五)浏览器访问 `localhost:3000/` 时,Vite做了什么,在之前几篇文章中我们知道了Vite的启动过程。当我们执行yarnrundev之后,Vite会初始化配置项、预构建、注册中间件,并启动一个服务器。之后就不会再进行其他操作,直到我们访问localhost:3000/当我们访问localhost:3000/时,会通过中间件拦截文件请求,并处理文件,最终将处理后的文
471
代码人生
01-01 08:00
代码人生
Vite 源码(二)vite启动流程以及如何获取config配置
Vite 源码(二)vite启动流程以及如何获取config配置,当在控制台输入yarnrundev时,执行对应源码的位置是node/cli.ts。import{cac}from'cac'//创建CLI实例,'vite'表示,在help和version命令中显示的名称constcli=cac('vite')//添加命令项cli.option('-c,--config',`[string]usesp
241
代码人生
01-01 08:00
代码人生
vite系列:手写一个简易版的vite-(依赖预构建版本)
vite系列:手写一个简易版的vite-(依赖预构建版本),之前我们已经实现了一个不带依赖预构建版本的vite,在vite2.0中增加了一个代表性优化策略依赖预构建今天我们也来手写一个。我们要实现的功能如下图所示:依赖预构建功能实现对SFC的解析实现对vue3语法的解析实现对html和js的解析最后实现一个对数字的加减操作功能代码分两部分依赖预构建部分本地服务部分先开始编写依赖预构建部分先把所需要
316
代码人生
01-01 08:00
代码人生
vite中的dev-dev-server源码解读
vite中的dev-dev-server源码解读,dev-dev-server从文档中的注释,引用谷歌翻译。作用大致如下:浏览器请求导入作为原生ES模块导入-没有捆绑。服务器拦截对*.vue文件的请求,即时编译它们,然后将它们作为JavaScript发回。对于提供在浏览器中工作的ES模块构建的库,只需直接从CDN导入它们。导入到.js文件中的npm包(仅包名称)会即时重写以指向本地安装的文件。目前
125
代码人生
01-01 08:00
代码人生
vitePress快速搭建及部署一个博客
vitePress快速搭建及部署一个博客,什么是VitePress?VitePress是VuePress的小弟弟,但是vitepress是在Vite上构建的。动机主要是因为太慢!但是不怪VuePress,怪Webpack!Vite则非常好的解决了问题:1.几乎实时的服务启动2.根据需要编译页面3.非常轻量快速的HMR(热模块重载)另外,本身VuePress一些设计问题一直没有时间去修复,正好这次做
592
代码人生
01-01 08:00
代码人生
Vite实战指北(vite中文文档)
Vite实战指北(vite中文文档),Vite是一个开源的前端构建工具,起初只支持对Vue的打包构建(毕竟由尤雨溪牵头开发),但到了目前的2.0版本,Vite已经实现了所有项目框架的打包构建,Vite以几乎无法察觉的编译速度和无须重新刷新页面即可得到结果的优势被誉为下一代的构建工具。为什么Vite这么快?Vite做了很多避免重复编译的事情,比如类库缓存、热更新无须刷新页面、多文件束成一个文件节省A
2093
代码人生
01-01 08:00
代码人生
Vite+Vue3+TypeScirpt搭建单元测试
Vite+Vue3+TypeScirpt搭建单元测试,Coding完单元测试是必修之一,特别是写公共组件,毕竟谁也不想下次修改完心里没底是不。Vue推荐的是VueTestUtils加jest组合。在Vue-Cli下非常的简单,主要一句话:vueaddunit-jest复制代码可是Vite中没有相应的用法,下面就手把手列出流程。先在根目录写jest.config.js:module.exports=
179
代码人生
01-01 08:00
代码人生
vite的项目,使用rollup打包的方法
vite的项目,使用rollup打包的方法,技术栈viterollup打包方式vue-cli自带的是webpack的打包方式,打出的包体积有点大,而vite自带的是rollup的打包方式,这种方式打包的体积就非常小,官网也有一些使用说明,所以学会之后还是比较很方便的。vite的库项目可以分为两类:(我自己分的)一个是纯js的项目,不带HTML;一个是可以带上HTML(模板)的项目,比如UI库。下面
445
代码人生
01-01 08:00
代码人生
vite + typesctipt+mockjs搭建mock环境
vite + typesctipt+mockjs搭建mock环境,1.安装依赖npminstallmockjs-Snpminstallvite-plugin-mock复制代码2.配置vite.config.js一定要注意supportTs配置,这个是决定监听的是ts还是js,很重要再一个是要将watchFiles文件夹监听打开,这样更改mock的时候,不需要重新启动编译import{defineC
213
代码人生
01-01 08:00
代码人生
vite element-plus项目快速debug源码的方式
vite element-plus项目快速debug源码的方式,前提vite项目,且只是debugelement-plus的部分源码,至于webpack的项目,以前没注意是不是也可以这样为什么要debug源码有时候遇到官方文档没说清楚的地方,或者使用时与预期结果不符,想debug源码看看,或许这是比较快的解决问题的方式?具体做法以表单组件为例定义一个ref与表单绑定,并打印ref//定义refco
393
«
1
2
3
4
5
6
»