自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(29)
  • 资源 (1)
  • 收藏
  • 关注

原创 第二章,学习TypeScript泛型

声明接口的时候 在名字后面加一个<参数>,使用的时候传递类型(arg:T):Treturn arg。

2024-02-19 11:42:28 314

原创 在项目中使用ECharts

上面的代码会引入 ECharts 中所有的图表和组件,如果你不想引入所有组件,也可以使用 ECharts 提供的按需引入的接口来打包必须的组件。

2024-01-23 11:44:38 369

原创 在vue2中使用vue-seamless-scroll组件

下列这个例子就是没有直接在vue-seamless-scroll组件上加样式,而是在父级wrap-container上加上样式,同样可以实现无缝滚动。注意:需要给父容器一个height和 overflow:hidden.左右滚动需要给ul容器一个初始化css width.我们自己使用的时候也可以加上父容器,给父容器设置边框等内容。上面这个是最简单的官方使用案例。

2024-01-11 11:46:20 597

原创 vue3中使用Swiper组件

请注意,如果您传递这些参数而不指定其元素(例如,没有 navigation.nextEl、pagination.el 等),Swiper Vue 组件将为导航、分页和滚动条创建所需的元素。Slides manipulation module,提供对幻灯片的各种操作和调整功能。Hash Navigation module,通过URL的哈希部分实现页面的导航功能。Navigation module,提供导航按钮以控制幻灯片的切换。Pagination module,提供分页器以控制幻灯片的切换。

2024-01-09 11:18:34 2700 1

原创 git 报错--unable to access ‘https://XXX/imooc-visualization.git

和https代理,但是我们本地环境本身就有SSL协议了,所以取消git的https或者http代理即可。在git push时或者clone时,中间会有git的。2,上述方案要还是无法解决,运行以下命令。

2023-12-05 14:12:18 257

原创 git切换分支

背后的原因:一个本地的git repo只有一个工作区和暂存区,但是有多个分支的提交区,而我们的checkout只是将HEAD指针从一个分支切换到另一个分支。2. add但不commit,可以stash,然后checkout回来之后stash apply,在commit,提交到当前分支。3. add但不commit,也不stash,直接checkout,然后再commit的话,记录就在切换分支下面。,经常因为切换分支没有保持一个干净的分支,而把主分支的代码,提交到了其他分支上!总结一下,别再犯错,别再犯!

2023-11-30 15:52:55 115

原创 pinia的使用

Store 是使用 defineStore() 定义的,并且它需要一个唯一名称,作为第一个参数传递。

2023-11-10 15:51:15 62

原创 vxe-table表头自定义html模板

vxe-column上加上tpye = "html" , title可以直接赋值为html字符串。列直接定义在vxe-table中的,直接使用header插槽定义。

2023-10-26 15:16:50 789

转载 vue3实现动态组件加载写法

【代码】vue3实现动态组件加载写法。

2023-09-12 17:13:28 538

原创 element-plus动态表单验证

一,el-form动态验证表单,是直接将rules绑定到需要动态验证的。

2023-07-28 15:19:09 568

原创 项目中接口类型的定义

一,定义一些全局公用类型。

2023-07-28 10:46:37 76

原创 十二,vue3+vite 统一接口管理

二,新建types.ts文件。

2023-07-26 09:47:10 460

原创 typescript中的unknown 类型

它代表所有可能的 JavaScript 值 — 基本类型,对象,数组,函数,Error,Symbol,以及任何你可能定义的值。在 TypeScript 中,任何类型都可以被归为 any 类型。类型的值执行大多数操作之前,我们必须进行某种形式的检查。成为 TypeScript 类型系统的另一种顶级类型(另一种是。类型,可以很容易地编写类型正确但是执行异常的代码。这是我们之前看到的相同的一组赋值示例,这次使用类型为。类型的值执行操作之前,我们不必进行任何检查。变量的所有赋值都被认为是类型正确的。

2023-07-20 17:35:09 639

原创 十一、vue3+vite项目配置mock数据

在根目录创建mock文件夹:去创建我们需要mock数据与接口!在 vite.config.js 配置文件启用插件。在mock文件夹内部创建一个user.ts文件。

2023-07-14 15:49:14 1368 1

原创 十、vue3+vite项目中引入sass

我们目前在组件内部已经可以使用scss样式,因为在配置styleLint工具的时候,项目当中已经安装过sass sass-loader,因此我们再组件内可以使用scss语法!!!需要加上lang="scss".接下来我们为项目添加一些全局的样式一,引入reset.scss在src/styles目录下创建一个index.scss文件,当然项目中需要用到清除默认样式,我们在npm官网中搜索,然后复制代码因此在index.scss引入reset.scss。

2023-07-14 15:11:16 1390

原创 九、vue3+vite项目中配置SVG图标

在开发项目的时候经常会用到svg矢量图,而且我们使用SVG以后,页面上加载的不再是图片资源,这对页面性能来说是个很大的提升,而且我们SVG文件比img要小的很多,放在项目中几乎不占用资源。

2023-07-10 15:50:25 1868

原创 四,vite开发环境、生产环境配置

一个项目可能会有开发版本、上线版本、测试版本等等多个版本,不同的环境会有不同请求api接口,就需更改一些基本配置,这时候就显得很麻烦,所以这里就使用了环境变量。我们只需做简单的配置,把环境状态切换的工作交给代码。

2023-06-15 10:47:48 9746 1

原创 八,vue3+vite项目配置环境变量

项目开发过程中,至少会经历开发环境、测试环境和生产环境(即正式环境)三个阶段。不同阶段请求的状态(如接口地址等)不尽相同,若手动切换接口地址是相当繁琐且易出错的。于是环境变量配置的需求就应运而生,我们只需做简单的配置,把环境状态切换的工作交给代码。顾名思义,开发使用的环境,每位开发人员在自己的dev分支上干活,开发到一定程度,同事会合并代码,进行联调。生产环境是指正式提供对外服务的,一般会关掉错误报告,打开错误日志。测试同事干活的环境啦,一般会由测试同事自己来部署,然后在此环境进行测试。

2023-06-15 09:36:34 298

原创 vite的依赖预构建

依赖预构建是指 Vite 在启动时会对项目中的依赖进行分析并将其预构建成浏览器可识别的形式。这样在浏览器中加载组件时就无需再进行模块的编译和构建,大大提高了应用程序的运行速度。

2023-05-31 11:50:22 957

原创 七,vue3+vite项目配置--引入element-plus

硅谷甄选运营平台,UI组件库采用的element-plus,因此需要集成element-plus插件!!!如果您使用 Volar,请在 tsconfig.json中通过 compilerOptions.type指定全局组件类型。

2023-05-29 15:03:38 638

原创 六、vue3+vite项目配置--- 强制使用pnpm包管理器工具

团队开发项目的时候,需要统一包管理器工具,因为不同包管理器工具下载同一个依赖,可能版本不一样,导致项目出现bug问题,因此包管理器工具需要统一管理!在根目录创建scritps/preinstall.js。文件,添加下面的内容。

2023-05-29 10:17:56 565 1

原创 五 、vue3+vite项目配置commitlint

当我们 commit 提交信息时,就不能再随意写了,必须是 git commit -m 'fix: xxx' 符合类型的才可以,对于我们的commit信息,也是有统一规范的,不能随便写,要让每个人都按照统一的标准来执行,我们可以利用。在生成的commit-msg文件中添加下面的命令。信息的时候,前面就需要带着下面的。中配置scripts命令。配置结束,现在当我们填写。

2023-05-26 16:45:47 403 1

原创 四,vue3+vite项目配置husky

在上面我们已经集成好了我们代码校验工具,但是需要每次手动的去执行命令才会格式化我们的代码。如果有人没有格式化就提交了远程仓库中,那这个规范就没什么用。会在根目录下生成个一个.husky目录,在这个目录下面会有一个pre-commit文件,这个文件里面的命令在我们执行commit的时候就会执行。要做到这件事情,就需要利用husky在代码提交之前触发git hook(git在客户端的钩子),然后执行。当我们对代码进行commit操作的时候,就会执行命令,对代码进行格式化,然后再提交。来自动的格式化我们的代码。

2023-05-26 16:22:18 624 1

原创 三,vue3+vite项目配置stylelint

为css的lint工具。可格式化css代码,检查css语法错误与不合理的写法,指定css书写顺序等。最后配置统一的prettier来格式化我们的js和css,html代码。

2023-05-26 16:03:06 968 2

原创 二,vue3+vite项目配置eslint和prettier

2,生成配置文件:eslint.cjs。1,安装eslint。

2023-05-25 17:23:42 1173

原创 使用 Nginx部署前端项目

windows系统右键我们下方任务栏的黑色部分,打开任务管理器,看下nginx是否启动。,这是一个非常重要的文件,用来配置nginx服务器,默认的配置也存放在此。以windows版为例,下载后,将其解压到 本地的任一目录下;,把解压的文件放在里面,此时我们可以看到有如下目录。然后用vscode代码编辑器打开解压文件夹下的。

2023-05-23 17:09:16 2608 2

转载 Vite 的首屏性能为什么不好?

Vite 给人一种又快又慢的感觉,快主要体现在 DevServer 的启动和热更新上,但随之带来的问题是,首屏性能不好以及页面加载时间长的问题。那为什么 Vite 的首屏性能不是怎么好呢?

2023-05-23 14:24:44 296 2

原创 vite打包优化

但是还是有个700多kb的echarts插件和500多kb的element-puls....所以按需引入eleplus和选择合适的插件还是很重要的。再次 npm run build,文件就被拆开了,而不是所有引入的js都拼在一起。拆分后文件个数变成了206个,多了15个。再次打包生成后的js文件中,就几乎没有console.log以及debugger了。解决方式:添加如下代码,去除打包后的console.log。打开build之后的js文件,生成了相应的压缩文件。对比一下,没压缩之前的文件,确实小了很多。

2023-05-23 14:02:37 4290 2

原创 vite中引入图片的几种方式

该目录中的资源在开发时能直接通过 / 根路径访问到,并且打包时会被完整复制到目标目录的根目录下。请注意: 引入 public 中的资源永远应该使用根绝对路径 —— 举个例子,public/icon.png 应该在源码中被引用为 /icon.png。在一个 JavaScript 模块中,通过相对路径我们就能得到一个被完整解析的静态资源 URL:(相对路径一定要写正确,当前引入图片的文件,相对图片的位置)生产环境,开发环境统统无效。目录会更省事,不管是开发环境还是生产环境,可以始终以根目录保持图片路径的一致。

2023-05-19 16:44:19 7478 2

php+mysql 留言板 (超完整功能齐全)代码详细

代码非常的详细,功能齐全,还附带数据库数据,完整的一个留言板项目。适合初学PHP者,刚开始学习开发项目.

2015-06-01

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除