草庐IT

Vite 4.3

全部标签

3d环形图开发(vue3+vite+ts)

开发效果(待完善): 技术支持:Echarts echarts-gl安装:注:echarts与echarts-gl版本需对应,可参考官网pnpmaddecharts@4.9.0echarts-gl@1.1.2 组件封装:import{getCurrentInstance}from"vue"const{proxy}=getCurrentInstance()asany;import'echarts-gl';constoptionData=ref([{name:'aaa',value:10000,itemStyle:{color:'#AE6D56',}},{name:'bbb',value:1211

基于Vue3+Vite+TS+ESLint+Prettier+Husky+lint-staged+commitlint+stylelint的项目构建

博客后台管理系统使用后的是基于Vue3+Vite+TS+ESLint+Prettier的开发,具体项目构建如下1、基于Vite创建vue-ts模板的项目骨架pnpmcreatevite项目名称--templatevue-ts2、安装ESLint、Prettier相关的ESLint:控制代码质量Prettier:控制代码风格2.1、安装ESLint、Prettier相关相关包pnpminstalleslinteslint-plugin-vueeslint-config-prettierprettiereslint-plugin-importeslint-plugin-prettiereslint

vue3+ts+vite 路由详解

 安装1.首先创建项目npminitvite@latest 输入文件名,选择Vue、TypeScript2.vscode打开项目,安装router,less,less-loader,@types/nodenpmivue-router-Snpmilessless-loader-Snpmi@types/node-Dnpminstallpinianpminstallanimate.css--save*注意Vue3中router要安装4版本,3版本的router语法和4不一样。3.在components中创建login.vue和register.vue文件我是注册组件4.在src下创建router文件

react中一些vite常见配置

使用vite,首先要在项目根目录创建vite.config.js的文件,如果使用ts的话,也可以是.ts文件。这里其实重点想要说的是,vite属于新兴的工具,所以对于他的配置项,我们必然是很陌生的,但是官方很贴心的,给我们提供了方案——一个可以给出配置提示的方法:import{defineConfig}from'vite'importreactRefreshfrom'@vitejs/plugin-react-refresh'importpathfrom'path';exportdefaultdefineConfig({plugins:[reactRefresh()],})如上,只要引用defi

electron+vite+vue3项目搭建

1.创建项目npminitvite@latest或者npmcreatevite)2.安装electron相关依赖npminstallelectron-Dnpminstallvite-plugin-electron-D//常用版本:"vite-plugin-electron":"^0.8.3";"electron":"^19.0.10",3.在vite.config.ts中,配置Electron入口文件import{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'importelectronfrom'vite-plugin-elec

微信公众号跳转小程序 wx-open-launch-weapp,在vue3+vite中使用 (多个问题集锦)

写这篇文章为了解决现在没有一个合集,所以我参考其他文档,及自己的测试最后得出完整的方案1.公众号后台关联小程序要求已认证的服务号,在服务号中关联要跳转的小程序配置JS接口安全域名2.调用wx.config配置‘wx-open-launch-weapp’标签微信公众号3.修改微信本来的内联script重点是v-is=“‘script’”4.IOS,在标签中写图片则点击无效问题,替换方案‘wx-open-launch-weapp’标签中的dom样式,如果是在vue3中,建议写成内联样式这里写页面样式,下面的wx-open-launch-weapp用来做这个的遮罩,透明度改成零就好作者:白马不是马

报错:[plugin:vite:import-analysis] Failed to resolve import “axios“ from “src\components\Main.vue“. Do

  这个错误通常表示您的代码中缺少axios库或者它没有被正确引入。您可以按照以下步骤解决问题:确认您已经安装了axios库。您可以在终端中使用以下命令来安装axios:npminstallaxios确认您已经正确引入axios库。在您的组件中,您需要使用以下方式来引入axios库:importaxiosfrom'axios';确认您的路径是否正确。在错误信息中提到了一个路径“src\components\Main.vue”,请确保这个路径正确,文件存在,并且您已经正确引入了axios库。如果您按照以上步骤操作之后仍然无法解决问题,那么您可以尝试重新安装axios库或者检查其他可能出错的地方。

前端2023最全面试题(javaScript、typeScript、vue2、vue3、html、css、uniapp、webpack、vite、react)

JavaScript1.JavaScript中的闭包是什么?答案:JavaScript中的闭包是一种函数,它有权访问其词法环境的变量和其它函数。这意味着,即使其包含它的函数已经执行完毕,其词法环境仍然存在,因此可以访问其作用域内的变量。2.JavaScript中的回调函数是什么?答案:回调函数是在某个特定事件之后执行的函数。在JavaScript中,通常使用回调函数来处理异步操作,例如读取文件、从数据库获取数据等。3.JavaScript中的原型是什么?答案:在JavaScript中,每个对象都有一个原型对象,它定义了该对象的属性和方法。原型对象本身也有一个原型对象,这样一层层直到一个对象的原

vite3 + vue3 + pinia 配置 CDN 后打包部署后出现 Failed to resolve module specifier “vue“ 报错处理

参考文章:pinia踩坑总结报错分析在项目中使用到了pinia,其中vue配置了CDN,开发环境下一切正常,部署后报了如下的错误:Failedtoresolvemodulespecifier"vue".Relativereferencesmuststartwitheither"/","./",or"../".随后我关闭了CDN,再次部署,报错就没了,难道问题出在了CDN配置上?但是,当我继续使用CDN,通过配置2个不同的路由页面,一个页面使用了pinia,另一个页面不使用pinia时,发现不使用pinia的页面是可以进行路由跳转的,使用了pinia的页面依然报错导致路由无法跳转,所以问题应该还

Vue3+Vite项目搭建

技术栈:vue3+ts+vite+vue-router+element-plus+pinia1、vite创建vue3+ts项目:为什么选择vite而不是vue-cli:vite是一个基于Vue3单文件组件的非打包开发服务器,它做到了本地快速开发启动:快速的冷启动,不需要等待打包操作;即时的热模块更新,替换性能和模块数量的解耦让更新飞起;真正的按需编译,不再等待整个应用编译完成,这是一个巨大的改变。(平均一秒run)1.1初始化cnpminitvite@latest1.2项目信息输入项目名称选择Vue(如果上下键不能选择,就手动输入选项,再回车)选择TypeScript创建完毕1.3效果:1.4