dotenv加载变量

@tsignoreimportdotenvfromdotenvimportpathfrompath_初始化测试环境变量exportconstinittestenv=()={const__dirname=pathdirname(importmetaurl)_constenvpath=pathrelative(processcwd()pathjoin(__dirnameenvdevelopmentlocal))replace()consolelog(envpath)dotenvconfig({path_env
阅读更多

使用vitest对vite项目进行单元测试

使用vitest对vite项目进行单元测试缘由开发阶段经常需要测试一段代码正确性每次都去启动服务器验证实际上是不明智的。之前我一直采用单文件测试但是后来越来越发现这种弊端对于简单逻辑尚可一旦需要各种依赖时候就会出现单文件的环境与实际项目差别太大问题。解决那么解决方案就是我们今天要学习的vitest单元测试框架_专门为vite项目量身定制。上手先安装yarnadddvitest
阅读更多

vite使用nodeJS内置的模块

vite使用nodejs内置的模块问题背景vite是一个新工具有助于快速启动和简化前端javascript开发。vite相对于parcel等其他解决方案的主要优势是速度更快并将编译限制为对依赖项的一次性操作保持源代码不受影响(如果您不需要因为jsx或typescript)。vite下一代前端工具它由两个主要部分组成_一个通过原生es模块为您的源文件提供服务的开发服务器具有丰富的内置功能和惊人的快速热模块替换(hmr)。一个构建命令将您的代码与rollup捆绑在一起预先配置为输出高度优化的静态资产以用于生产
阅读更多

yarn和npm设置国内镜像源

feat_更新最新镜像地址。由于npm包部分依赖下载速度缓慢最好使用国内镜像源来解决一般使用淘宝开源的镜像。安装yarnnpmigyarnyarn设置国内源yarnconfigsetregistryhttps_registrynpmmirrorcomglobalyarnconfigsetdisturlhttps_npmmirrorcompackagedistglobalyarnconfigsetsass_binary_sitehttps_cdnnpmmirrorcombinariesnodesassglo
阅读更多

从零开始使用react写一个随机变色的标签组件

从零开始使用react写一个随机变色的标签组件标签定义及引用color_设置标签颜色visible_标签是否显示trueclosable_标签是否可以关闭(点击默认关闭)falseonclose_关闭会调icon_iconimportreact{usestate}fromreact_importclassnamesfromclassnames_interfaceipropstag{color?_string_visbile?_boolean_closable?_boolean_onclose?_()=ic
阅读更多

Next-js组件使用泛型类型传递异步数据

nextjs组件使用泛型类型传递异步数据定义类型typepageprops={hello_stringpage_anyrandom_any}返回属性https_githubcomvercelnextjsblobcanaryexamplescmswordpresspagesindexjsexportconstgetstaticprops_getstaticprops{constpageid=vtfmdmletpage=awaitgetpage(pageid)if(!page){page={}}return{
阅读更多

vue3的reactive和ref的区别

vue的reactive和ref的区别首先我们都知道ref函数和reactive函数都是用来定义响应式数据_但是reactive更适合定义复杂的数据类型(jsonarr)ref适合定义基本数据类型(可接收基本数据类型和对象)一句话_使用场景ref简单数据reactive复杂数据ref取数据需要加value参考https_juejincnpost
阅读更多

babel运行nodejs

安装依赖yarnadd@babelcore@babelcli@babelnode@babelpresetenvd或者全局安装yarnglobaladd@babelcore@babelcli@babelnode@babelpresetenv注意_全局安装需要把yarn的全局目录添加到windows的path查找path命令如下yarnglobalbin不建议全局安装很多时候以来都成问题完整的依赖{_{}_{}}配置babelrc{_[[{}]]}接下来运行即可编译babeltestjs编译与执行babeln
阅读更多