自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

zhanghaoran

blog.zhanghaoran.ren

  • 博客(41)
  • 收藏
  • 关注

原创 vue2[webpack]中接入vue3[vite]的qiankun微前端服务

在vue2[webpack]老项目中,使用qiankun.js微前端服务,接入vue3[vite]新项目。

2022-12-27 09:02:18 1720 3

原创 vue3&JSX 插槽使用指南

这篇文章是关于近期项目中,我在其中摸鱼凑数日子里积攒下来的, 记录在jsx和一般情况下 声明插槽、使用插槽、插槽传值 的笔记。

2022-08-12 11:32:55 4238

原创 封装后台通用型页面及编辑弹窗实现思路与过程

关于使用vue3.x+TS(X)+Arco Design等技术栈在一般后台系统中封装通用型大页面【表单筛选项+树状组织架构+表格+分页】及新增、编辑弹窗的实现思路、实现过程。

2022-08-10 10:55:04 1067

原创 前端上传图片添加水印

一文搞懂怎么在vue中配合element-ui 上传图片前给图片添加水印;包含实现思路,实现过程。

2022-05-31 15:55:38 1970 6

原创 百度GIS地图笔记

因我司是搞路桥等基建项目的,故在每个项目中都会牵扯到GIS地图相关的功能。本篇文章记录下我在Vue.js项目中使用百度GIS地图的一些笔记。官方文档:https://lbsyun.baidu.com/index.php?title=jspopularGL/guide/showAPI类:https://mapopen-pub-jsapi.bj.bcebos.com/jsapi/reference/jsapi_webgl_1_0.html初始化地图引入百度地图API文件// index

2022-03-08 14:54:47 709

原创 vue3初步使用笔记

最近搭建了一个疫情车辆管理系统,采用的是vue3+Arco Design+vite, 使用起来很不错,特别vite也太快了吧,本文主要记录下vue3、vite.Vite创建应用(vue/react)npm create vite@latestVite配置环境变量新建环境变量文件// 开发环境.env.development# 必须指定VITE_MODE_NAME=developmentVITE_LOCAL_BASE_API = 'http://192.168.0.155:8090'

2022-03-03 10:04:09 712

原创 nuxt.js常见问题总结

最近在开发我司一项目,用的是nuxt.js开发的,nuxt版本号:2.14.8。主要记录一下,我在这个项目中一些用到的东西吧,地址:http://www.lawlawing.com/感觉基本包含了nuxt.js的大部分配置了。安装第一种办法:此方法可参考我的这篇文章:初识nuxt.js我的npm 下载太慢了,所以用了第二种办法npx create-nuxt-app <project-name>文档:https://nuxtjs.org/docs/2.x/configurati

2022-01-27 16:07:52 3235

原创 2021年前端开发不完全指南

主要记录2021年五月、六月、七月、八月、九月我所遇到的和我经历的奇葩问题、报错、异常、开发笔记心得、工作琐碎等。。。一起期待2022年吧! 本命年 太难了五月vue-router: TypeError: Cannot read property ‘$createElement’ of undefined错误信息:vue-router.esm.js?fe87:2314 TypeError: Cannot read property '$createElement' of undefined

2022-01-27 15:52:29 259

原创 Ubuntu装机常用配置

最近买了个腾讯云服务器,三年两百多;好久不玩Linux,折腾了好久… 记录下装完系统后的一些操作吧。包含:Ubuntu常用命令,重置root密码,开启远程访问,远程文件传输,安装最新版node,安装nginx常用命令命令释义ls / ll两者都是列出当前目录所有文件pwd当前路径mkdir xx创建xx目录touch xx.js创建xx.js文件cat xx.js查看你xx.js内容mv source target移动文件tar -c

2022-01-20 15:14:45 1922

原创 关于disk项目的相关笔记

前段时间,在闲来无事和被某度的限速的逼迫下,想自己搞个网盘系统;但后续因其他原因,我们叫此项目为文件管理系统吧。文件管理系统:技术栈: vue+elementui,django+mysql系统支持: 分片上传,断点续传,秒传, 文件唯一性与公共性,文件流下载;支持生成用户并分配自定义磁盘大小,支持文件的属性修改等~ 【可以算是一个简陋型小网盘】项目访问地址:http://disk.zhanghaoran.ren/测试账号密码: bing/test123456gitee前端源码: https

2021-07-25 18:02:20 240

原创 lawlawing.com前端笔记

最近在开发我司一项目,用的是nuxt.js开发的,nuxt版本号:2.14.8。主要记录一下,我在这个项目中一些用到的东西吧,项目暂未上线。感觉基本包含了nuxt.js的大部分配置了。安装第一种办法:此方法可参考我的这篇文章:初识nuxt.js我的npm 下载太慢了,所以用了第二种办法npx create-nuxt-app <project-name>文档:https://nuxtjs.org/docs/2.x/configuration-glossary/configura

2021-01-27 11:16:49 200

原创 NProgress使用笔记

关于在vue-spa中使用NProgress来显示在页面顶部的进度条笔记。安装+基本用法// 下载安装npm i nprogress -S// 基本用法NProgress.start(); // 开启进度条NProgress.done(); // 关闭进度条常用配置**递增:**要递增进度条,只需使用.inc()。这使它以随机量递增。这将永远不会达到100%:将其用于每次图像加载(或类似加载)。NProgress.inc();如果要增加特定值,可以将其作为参数传递:NPr

2021-01-15 10:08:57 574

原创 vue项目落地(qiankun.js)微前端服务

什么是微前端?网上抄的:微前端是一种类似于微服务的架构,它将微服务的理念应用于浏览器端,即将单页面前端应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用还可以独立开发、独立部署。同时,它们也可以在共享组件的同时进行并行开发.我的理解:微服务就像是一个操作系统:在其中可以运行多个app。但每个app呢,又可以脱离操作系统独立运行。为什么选择qiankun.js | qiankun.js优点大白话:就目前市面上没有比qiankun.js更好用的了。虽基于 single

2020-10-23 14:55:13 3821 1

原创 jenkins自动化构建vue程序并发布至远程服务器

综述:记录在Ubuntu上安装Jenkins,并使用gitee源码进行自动化打包vue(nuxt)程序发布部署到远程服务器。1.在Ubuntu上安装Jenkins1.0. 安装Java SDKsudo apt-get install openjdk-8-jdk1.1. 安装JenkinsUbuntu默认软件包中的Jenkins版本不是最新版本。 为了利用最新的修复和功能,我们将使用项目维护的软件包来安装Jenkins。首先,将存储库密钥添加到系统wget -q -O - https://pk

2020-10-23 14:45:25 425

转载 Ubuntu安装/卸载node,npm

安装nodesudo apt-get install nodejssudo apt-get install nodejs-legacy安装最新的 node v10.xcurl -sL https://deb.nodesource.com/setup_10.x | sudo -E bashsudo apt-get install -y nodejs安装npmsudo apt install npm升级到最新的 npmsudo npm install npm@latest -g非ro

2020-06-17 23:03:12 1556

原创 nuxt中引入tinymce编辑器

起因Nuxt.js是一个服务端渲染框架。在一开始项目中使用的是quill.js编辑器,因其支持服务端渲染,但后期其功能过于少,故选择了非常强大的tinymce编辑器。本文首发于: http://zhanghaoran.ren正文安装tinymcenpm i @tinymce/tinymce-vue tinymce -s在~/static/目录下创建tinymce文件夹,下载完tinymce后在node_modules 中找到 tinymce/skins目录,将其复制到static/t

2020-06-17 23:00:03 2351 5

原创 nuxt.js中按需加载 element-ui遇到的问题

下载element-uinpm i element-ui -S在~/plugins/下 新建一个名为 element-ui.js文件import Vue from 'vue'import {form, input, formItem, button, message} from "element-ui";Vue.use(form);Vue.use(formItem);Vue.use(input);Vue.use(button);Vue.prototype.$message = .

2020-05-19 15:13:46 1082

原创 nuxt.js 在middleware(中间件)中实现路由鉴权

路由鉴权: 就是判断这个路由当前浏览者是否需要权限访问。一般我是通过判断cookie中存储的token来判断的。在middleware文件夹下新建“auth.js”的文件在当前auth.js文件内判断cookie中是否包含token字段import getCookie from '~/utils/getCookie'export default function ({route, re...

2020-04-08 10:12:58 4138

原创 nuxt.js中 前端 加密解密

在~/plugins下新建 encrytion.js文件const crypto = require('crypto');export default { aesEncrypt(data, key){ try{ var salt = key.toString() + 'manbanzhen'; // 定义盐值 const cipher = cryp...

2020-04-08 09:57:13 3088 3

原创 nuxt.js中使用vue-cropper实现图片裁剪

最近我司一项目,在个人中心页面上需用户上传个性传封面图(类似知乎个人主页上部),用户上传图片大小不一,且封面图大小为1000px*240px;这就需要在用户上传的时候对图片进行合适大小裁剪。大概思路:用户上传图片时判断图片尺寸大小,宽高不能小于1200px240;小于这个尺寸将无法完美裁剪。将图片转化为base64格式,即时回显图片和不浪费服务器资源。这两步完成后,将进入到vue-c...

2020-04-08 09:49:55 4256 5

原创 nuxt.js中 axios的配置

1.下载axiosnpm i @nuxtjs/axios -s2. 在nuxt.config.js中配置axiosmodules: [ '@nuxtjs/axios', ],此时, 就可以在组件中使用啦async asyncData({$axios}) { let { res } = await $axios.get(`https://xxx.com/api/xx...

2020-04-08 09:49:18 2272

原创 nuxt.js常见配置

在创建完一个Nuxt.js项目后,需要对它进行一些常用的常见的配置,以便于后续开发。关于创建nuxt.js和初始,请点击 >> https://www.jianshu.com/p/20caf50d86bf将css设为外联方式引入在 nuxt.config.js 文件中的 build 中加入以下代码:build: { // css文件外部引入 extractCSS...

2020-04-08 09:48:17 717

原创 初识nuxt.js

众所周知,如今前端SPA模式开发有三大框架三足鼎立:Angular、React、Vue;这三个框架非常优秀、并且生态各方面都比较好,而我独宠Vue。其中原生Vue渲染模式是CSR,这种渲染模式不利于搜索引擎的搜录;而我司项目比较依赖搜索引擎的流量、加上后端初转前端的我只会Vue,搜索了大量资料、最终觉得Nuxt.js比较适合我这种新手。其已为开发者提供了许多配置,开箱即用,不费吹灰之力达到SSR...

2020-04-08 09:43:42 307

原创 nuxt.js中使用i18n国际化、本地化

nuxtjs中使用i18n安装 vue-i18nnpm install vue-i18n --save在nuxtjs 中引入vue-i18n在 ~/plugins文件夹下新建 i18n.js, 并键入以下代码:import Vue from 'vue'import VueI18n from 'vue-i18n'Vue.use(VueI18n)export defaul...

2019-10-08 22:55:18 2780 2

原创 django\+vue前后端分离项目部署nginx服务器

准备前端vue打包后代码后端程序源代码服务器安装nginx, 数据库安装配置等部署部署前端项目:前端代码放在 /home/www/dict 下;部署后端项目:上传后端代码到 /home/www/order 下;安装所依赖库收集静态资源在setting.py 中指定地址:STATIC_ROOT = os.path.jo...

2019-09-23 16:58:49 1195

原创 nuxtjs项目部署Ubuntu服务器

由于为了达到更好的SEO效果,最近研究了下nuxt.js 来做服务端渲染(SSR)。本文来讲讲,在本地开发完成后怎么在服务器上配合nginx部署node项目。技术栈:nuxt.js -- 2.9.2nginx -- 1.10.3pm2 -- 3.5.1node -- v10.16.3npm -- 6.9.0步骤:本地打包、上传到服务器安装服务器环境安装项目依赖和测试...

2019-09-23 16:57:54 754

原创 项目1 前端开发总结

前端采用技术栈为:vuenuxt.jsiviewjqeury遇到两大问题:各个屏幕尺寸之间 分辨率自适应问题各个浏览器版本之间的兼容性问题遇到的小问题轮播图片、轮播动画css3动画postion定位服务端字体 与 客户端字体的显示问题各个屏幕分辨率下 字体粗细问题·解决:各个屏幕尺寸之间 分辨率自适应问题采用iview的响应式布局。在开发过程中...

2019-09-23 16:56:04 279

原创 django部署到Ubuntu服务器

django部署到Ubuntu服务器环境:python:3.6.5django: 1.11mysql :Ver 14.14 Distrib 5.7.26, for Linux (x86_64) using EditLine wrapperUbuntu: 18.04.1 LTSuwsgi和nginx为下载默认版本原文地址: http://w...

2019-05-13 12:11:21 1217

原创 Django项目中配置全文检索

Django项目中配置全文检索之前我们需要查询匹配数据的时候,只能使用模糊查询,这种查询方式效率低下,在企业开发中是不能使用的。在真正的企业级 web 项目,都需要一些基于全文检索的框架或者 工具模块(如 Lucene、Whoosh、Xapian、Elasticsearch、solr 等) ,不同于特定字段的模糊 查询,全文检索的效率更高,并且能够对于中文进行分词处理。Django Hay...

2019-04-30 18:10:08 293

原创 ajax -- django 已解决 -- 拦截跨源请求:CORS 头缺少 'Access-Control-Allow-Origin

解决 : 拦截跨源请求在最近【前后端分离】项目中,ajax请求api,出现如下图所示错误:错误信息:已拦截跨源请求:同源策略禁止读取位于 http://127.0.0.1:8000/users/api/v1/register/ 的远程资源。(原因:CORS 头缺少 'Access-Control-Allow-Origin')。python相关技术圈--> http://...

2019-04-30 17:58:10 2017

原创 python—Django面试题汇总

基础高级django1. Django架构:MVT:Django遵循MVC设计,并有一个专有的名词:MVT1.M全拼为Model,与MVC的M功能相同,负责数据处理,内嵌了ORM框架。2.V全拼为View,与MVC中的C功能相同,接收HttpRequest,业务处理,返回HttpResponse3.T全拼为Template,与MVC中的V功能相同,负责封装构造要返回的html,内嵌了...

2018-11-23 23:42:27 4285

原创 CSS笔记

层叠样式表层叠样式表:Cascading Style Sheet :CSS主要同于标签的样式修饰:修饰内容、位置、颜色等等操作过程中,主要注意如下环节CSS的基本语法 CSS代码的位置 CSS选择器 常见样式CSS基本语法语法: 样式名称:样式的值如: color:red 内容中文本的颜色:红色background-c...

2018-11-23 20:18:55 168

原创 HTML笔记

慢半帧manbanzhen 常见标签处理 &lt;!doctype html&gt; 网页文档声明标签 &lt;html&gt; 网页所有内容包含标签 &lt;head&gt; 网页头部、网页属性设置标签 &lt;meta&gt; 包含在网页头部中,用于属性设置的具体标签 &lt;title&gt; 网页标题标签 &lt;bod...

2018-11-23 19:55:57 166

原创 Ubuntu下安装MySQL

Ubuntu下安装MySQLsudo apt-get install mysql-server sudo apt-get install mysql-client等着就安装完了。但是:输入mysql -u root -p 进不去数据库。解决办法:sudo vim /etc/mysql/debian.cnfuser就是当前数据库的账户,password就是当前数据库的密码...

2018-11-22 08:52:54 480

原创 MySQL事务和引擎的区别

MySQL事务和引擎的区别MySQL事务所谓事务:就是当要完成某个事情时,这个事情包含多个任务;当所有的任务都执行成功,这个事情就是成功的,所有改动的数据都会生效;当有某一个任务执行失败,这个事情就是失败的,所有改动的数据都会回滚。事务具有四大特性:原子性,一致性,隔离性,持久性 原子性(要么不谈,要谈就结婚) 原子性是指事务包含的所有操作,要么全部成功,要不全部失败回滚。 ...

2018-11-21 19:39:03 510

原创 Ubuntu服务器配合nginx反向代理 uwsgi 部署Django

首先我的操作系统是ubuntu-18.04-desktop-amd64,Django1.11,Python3.56,nginx和uwsgi是直接下载的最新版(2018-11-18下载的)。一.连接远程服务器 一般购买的服务器都会默认可用xsheel等工具连接。 在虚拟机上实验或者服务器没有开启远程连接权限的可参考--&gt;[ \[ubuntu上实现远程访问和ftp文件上传\]...

2018-11-19 19:30:51 263

原创 python中常见的反爬措施

python中常见的反爬措施1.伪装请求的头信息绝大多数的网站都会对请求的来源做判断,需要我们在请求的开始加入头信息。比如:2.IP封锁比如,有台机器对网站持续高频繁产生请求,我们就可以对其进行IP封锁;但IP封锁会造成误伤,致使一部分无辜用户被封禁,所以,要慎重。3.验证码当用户请求频率过高的时候,有些网站就会触发验证码验证机制,让你输入各种验证码。常见的比如:访问淘宝的时候再进...

2018-11-15 21:19:31 464

原创 MySQL数据库中char和varchar的区别

MySQL数据库中char和varchar的区别char 的长度是固定的;varchar的长度是可变的。也就是说:我们定义一个char[11]和varchar[11],然后存在进去的是‘china’,那么这时候char占的长度依旧是11,除去‘china’外,后边还会跟着6个空格;而varchar会立马把长度变为5。在取数据的时候char需要用trim()去除空格; 而...

2018-11-15 20:40:55 1863

原创 ubuntu上实现远程访问和ftp文件上传

ubuntu上实现远程访问和ftp文件上传ubuntu上实现远程访问1.sudo apt-get install openssh-server2.cd /etc/ssh3.sudo vim sshd_config4.修改:PermitRootLogin yes5.重启服务 service sshd restart6.ifconfig 查看IP 远程连接7.在另一台电脑上可以通...

2018-11-15 16:56:57 1902

原创 html页面自动跳转的两种办法

下面举例说明,在2秒后,自动跳到百度首页的几种方法。1.html的实现&lt; head&gt;&lt; !-- 以下方式只是刷新不跳转到其他页面 --&gt;&lt; me ta http-equiv="refresh" content="2"&gt;&lt; !-- 以下方式定时转到其他页面 --&gt;&lt; me ta http-equiv="refresh&quo

2018-11-15 15:22:37 15322

空空如也

空空如也

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

TA关注的人

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