前端
文章平均质量分 62
普通网友
这个作者很懒,什么都没留下…
展开
-
Vue3 全家桶 + Element Plus + Vite + TypeScript + Eslint 项目配置最佳实践
尤大的 Vue3.0 已经发布有一阵子了,已经很成熟了。而且 Element Plus + Vite 也出了一段时间了,是时候该上手体验分享一波了。主要是要熟练一下 Vue3,好准备用 Vue3 重构一下自己的网站项目: blog-vue-typescript ,计划是过年期间会着手重构这个项目,年后会上线。1. 初化化项目全局安装 vite-appnpm?i?-g?vite-app创建项目yarn?create?vite-app?<project-name>#?或者n.原创 2022-03-11 20:45:49 · 1837 阅读 · 1 评论 -
uniapp项目使用vue3
uniapp项目使用vue31.首先创建普通uniapp项目2.找到manifest.json文件vue版本选择 选择33.重新运行提示: 请确认您的项目模板是否支持vue3:根目录缺少 index.html在根目录下创建index.html,模板已放在下方<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="view原创 2022-03-11 19:22:17 · 4838 阅读 · 0 评论 -
pojo层,Dao层,Mapper层,service层,controller层
MVC框架即模型-视图-控制器(model-View-controller)M即model模型是指模型表示业务规则V即View视图是指用户看到并与之交互的界面C即controller控制器是指控制器接受用户的输入并调用模型和视图去完成用户的需求,控制器本身不输出任何东西和做任何处理。DAO层:DAO层叫数据访问层,全称为data access object,某个DAO一定是和数据库的某一张表一一对应的,其中封装了CRUD(增加Create、检索Retrieve、更新Update和删除Delet.原创 2022-03-11 15:21:47 · 954 阅读 · 0 评论 -
jsfor循环里绑定onclick事件报错Uncaught TypeError Cannot set properties of undefined (setting ‘className‘)
我想要实现如下效果:点击上面的栏目,切换下面栏目的内容编写代码如下(主要看js部分)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width原创 2022-03-11 13:59:17 · 1379 阅读 · 1 评论 -
gyp ERR find VS gyp ERR find VS msvs_version not set from command line or npm config gyp ERR find
npm install报错gyp ERR! find VSgyp ERR! find VS msvs_version not set from command line or npm configgyp ERR! find VS VCINSTALLDIR not set, not running in VS Command Promptgyp ERR! find VS checking VS2019 (16.3.29411.108) found at:gyp ERR! find VS “D:is原创 2022-03-11 12:37:27 · 977 阅读 · 1 评论 -
axios在vue中的使用
一、Axios是什么Axios是一个基于promise的HTTP库(类似于jQuery的Ajax,用于HTTP请求)可以用于浏览器和node.js(既可以用于客户端也可以用于node.js编写的服务端)二、Axios有哪些特性支持promise API拦截请求和响应转换请求数据和响应数据取消请求自动转换 JSON 数据客户端支持防御 XSRF三、Axios浏览器支持四、安装1.使用 npm:$ npm install axios2.使用 bower:$原创 2022-03-11 11:16:05 · 21245 阅读 · 2 评论 -
黑马vue电商后台管理系统总结
vue电商后台管理系统-阶段总结上个月把这个项目做完简单整理了一下文档,和大家交流分享一下一、项目技术栈前端前端采用 vue cli 脚手架搭建框架,使用 element UI 美化项目结构环境依赖(开发依赖,运行依赖)富文本编辑器nprogress加载进度条echarts图表展示第三方http库 axios后端后端是已经写好了的,采用 express 搭建的 API 服务,返回的数据是 JSON 格式的数据,只需要导入数据库,并配置一下数据库信息,就可以跑起来了,原创 2022-03-10 13:33:08 · 4023 阅读 · 8 评论 -
花了一天的时间给粉丝做了一个小米官网(高仿)
身为前端程序员,经常会找几个官网试试手,哈哈,这次拿小米官网试试手吧。目录?效果图:项目结构index.htmlindex.cssjs下载地址:点我下载效果图:项目结构index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>小米官网</title> <link rel.原创 2022-03-10 12:12:19 · 164 阅读 · 0 评论 -
前端案例:飞机大战( js+dom 操作,代码完整)
目录一、案例效果二、实现思路三、完整代码+详细注释四、涉及要点一、案例效果二、实现思路创建游戏背景板;创建我方战机,鼠标进入游戏面板后其随鼠标轨迹运动;onmousemove创建子弹,让子弹周期性的在战机处发出并让其向 top值减小的方向(向上)移动,top 小于 0 也就是子弹走出游戏面板时删除自身;创建敌机,让敌机周期性的在游戏背景板左侧的随机距离的位置产生,并让其向 top 增加的方向(向下)移动;定义函数,子弹和敌机相遇时消失。条件:所有的元素都只在鼠标进入游戏背景区转载 2022-03-09 14:28:49 · 562 阅读 · 0 评论 -
【面试利器】 原生JS灵魂拷问,你能答上多少(一)
前言目前的前端世界,三大框架横行,原生JavaScript所用越来越少。但我认为JavaScript作为每一个前端工程师的立身之本,学再多遍都不为过。因此我决定整理JavaScript中容易忽视或者混淆的知识点,写一系列文章,以灵魂追问的方式,系统且完整的带大家遨游不一样的JavaScript。系列文章【面试利器】原生JS灵魂拷问,你能答上多少(二)【面试利器】原生JS灵魂拷问,你能答上多少(三)JS类型之问——检测篇第一问:js中的数据类型有哪些?原始数据类型:共有7种Boole原创 2022-03-09 13:08:24 · 140 阅读 · 0 评论 -
Vue3基础(22)___vue3中使用$forceUpdate
在vue2中直接this.$forceUpdate()在vue3中直接import { getCurrentInstance } from "vue";setup(){//解构赋值 设置别名that 也可不写 :that 直接ctx let {ctx:that} = getCurrentInstance() that.$forceUpdate()}原创 2022-03-09 10:24:08 · 1513 阅读 · 0 评论 -
Vue 踩坑笔记 引入 ElementUI 时打包失败修复记录(ERROR in .node_moduleselement-uilibtheme-chalkindex.css)
Vue 踩坑笔记: 引入 ElementUI 时打包失败修复记录(ERROR in ./node_modules/element-ui/lib/theme-chalk/index.css Module build failed: ModuleBuildError: Module build failed: TypeError: this.getOptions is not a function)文章目录Vue 踩坑笔记: 引入 ElementUI 时打包失败修复记录(ERROR in ./node_m原创 2022-03-09 08:49:22 · 1808 阅读 · 1 评论 -
TypeError this.getOptions is not a function
今天用webpack打包项目,安装了less-loader模块之后报错,如下图:原因: less-loader安装的版本过高解决方案: 1.npm uninstall less-loader2.npm install less-loader@6.0.0原创 2022-03-08 14:09:04 · 143 阅读 · 0 评论 -
npm安装出现npm err FetchError Invalid response body while trying to fetch httpsregistry.npmjs.orgvu
npm ERR! FetchError: Invalid response body while trying to fetch https://registry.npmjs.org/vue: EPERM: operation not permitted, open ‘E:MajorDevToolsNodeJs ode_cache_cacache mpc56d9ce1’按照正常的安装教程之后, 一定要使用管理员身份打开cmd, 在运行npm install webpack -i 测试就运行成功了.原创 2022-03-08 12:48:40 · 4147 阅读 · 0 评论 -
JS案例:将前端页面导出为PDF
前言:记录一下最近的一个需求,产品需要打印表单凭证,需要实现将选中页面的元素或者是组件导出为PDF,方便打印使用到的JS库:html2canvas(截取页面生成canvas),jsPDF(使用JS生成PDF)下面我针对该需求实现一个简单的Demo,并且分享一下遇到的问题首先,我选择了懒加载的案例作为测试对象,因为图片可以检测截图效果,并且有滚动加载长页面我们把整个demo分为两部分,分别是使用上述两个插件实现基本功能使用html2canvas截屏生成canvas let prin原创 2022-03-08 11:28:29 · 936 阅读 · 1 评论 -
HTML5七夕情人节表白网页(雪花爱心表白) HTML+CSS+JS 求婚 html生日快乐祝福代码网页 520情人节告白代码 程序员表白源码 抖音3D旋转相册 js烟花代码 css爱心表白
HTML5七夕情人节表白网页雪花爱心 HTML+CSS+JS 求婚 html生日快乐祝福代码网页 520情人节告白代码 程序员表白源码 抖音3D旋转相册 js烟花代码 css爱心表白这是程序员表白系列中的100款网站表白之一,旨在让任何人都能使用并创建自己的表白网站给心爱的人看。 此波共有100个表白网站,可以任意修改和使用,源码已上传,演示网址如下。??文章末尾-已经附上源码下载地址??作者主页-更多源码??100款七夕情人节告白源码-专栏文章作品介绍1.网页作品简介 :基于 HTML+C原创 2022-03-08 10:08:06 · 1039 阅读 · 0 评论 -
购物车案例--过滤器
html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Docume原创 2022-03-07 10:13:51 · 79 阅读 · 0 评论 -
浅析npm run serve命令
本地开发一般通过执行 npm run serve 命令来启动项目,那这行命令到底存在什么魔法?我们来一探究竟。根据这篇文章思路:使用vue-cli初始化后运行npm run server到底干了什么得知,npm run serve 实际上会执行 vue-cli-service serve(该文件位于 node_modules.binue-cli-service.cmd),查看该文件,发现最终会执行 node vue-cli-service.js serve(该文件位于 node_modules@vue转载 2022-03-07 08:50:31 · 3824 阅读 · 1 评论 -
安装npm install -g @vuecl需注意 @vuecli 4.5.15
目前版本使用npm install -g @vue/cli出错,能用,后面会不断有不同类型的错误。比如安装npm i less less-loader --save建议 使用淘宝镜像先清除原来的npm uninstall -g @vue/cli安装淘宝npm install -g cnpm --registry=https://registry.npm.taobao.org查看淘宝镜像cnpm -v安装cnpm install -g @vue/cli原创 2022-03-06 05:19:17 · 532 阅读 · 0 评论 -
入门学习uni-app只需这一篇即可
uni-app是什么?由DCLOUD使用Vue技术开发所有前端应用的框架uni-app是干什么的?一套代码发布多个平台uni-app优势uni-app和Vue关系使用Vue开发在发布H5端,完全支持Vue语法发布小程序/app,实现部分Vue语法uni-app和小程序关系组件标签靠近小程序规范接口(API)靠近小程序规范完整的小程序生命周期uni-app规范页面文件遵循Vue单文件组件(SFC)规范组件标签靠近小程序规范接口(API)靠近微信..原创 2022-03-06 03:58:31 · 348 阅读 · 0 评论 -
「2022」打算跳槽涨薪,必问面试题及答案——VUE篇
1、为什么选择VUE,解决了什么问题?vue.js 正如官网所说的,是一套构建用户界面的渐进式框架。与其它重量级框架不同的是,vue 被设计为可以自底向上逐层应用。vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另外一方面,当与现代化工具链以及各种支持类库结合使用时,vue 也完全能够为复杂的单页应用提供驱动。vue.js 有声明式,响应式的数据绑定,组件化开发,并且还使用虚拟 DOM 等技术,统一编程规范和模块等,将项目功能模块化更方便组织和构建复杂应用,便于项目的扩展和维原创 2022-03-06 02:36:27 · 157 阅读 · 0 评论 -
vue前端跨域解决方案
为什么会出现跨域:浏览器访问非同源的网址时,会被限制访问,出现跨域问题.常见的跨域有三种:jspn跨域,原理:动态生成script标签,通过script标签引入接口地址(因为script标签不存在跨域的)cors跨域(后端开启) :全称 “跨域资源共享”,原理:它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制vue代理服务器proxy跨域:通过请求本地的服务器,然后本地的服务器再去请求远程的服务器(后端部署接口的服务器),最后本地服务器再将请求原创 2022-03-06 01:15:10 · 512 阅读 · 0 评论 -
vite无法使用require,require is not defined
错误原因require is not definednode.js不是内置对象的一部分,如果想用typescript写Node.js,则需要引入第三方声明文件vue无法识别require,执行命令:npm install @types/node --save-dev原创 2022-03-05 23:54:15 · 1830 阅读 · 0 评论