一枚攻城狮-优快云博客

原创 Vue3+Vite项目配置Eslint+Prettier+Husky+Lint-Staged+Commitlint

Vue3项目配置Eslint+Prettier+Husky+Lint-Staged+Commitlint

2022-12-14 18:20:52 3247 2

原创 lime-util 前端模块化 JavaScript 工具库

🔥 lime-util 🔥 是一个前端模块化 JavaScript 工具库，目前共有 245+ ⚡️ 个 Api 方法，包含了开发中经常用到的一些模块方法集合，如字符串，数组，浏览器缓存，浏览器Cookie，Dom处理，日期工具，数学计算，文件处理，正则校验，微信小程序工具库等等

2022-12-01 15:57:18 1160

css 命名规范可以避免不必要的样式冲突，命名可以参考 BEM 规范，以下是从网上收集整理过的一些规则，写样式再也不怕想不出来用什么 className 了！！1. 页面结构命名page // 代表整个页面，用于最外层。wrap // 外套，将所有元素包在一起的一个外围包，用于最外层wrapper // 页面外围控制整体布局宽度，用于最外层container // 一个整体容器，用于最外层head|header // 页头区域，用于头部nav // 导航条content /.

2021-12-25 23:45:33 680

原创 npm命令大全

NPM 的全称是 Node Package Manager，是随同 NodeJS 一起安装的包管理和分发工具，它可以很方便的让前端开发者下载、安装、上传以及管理已经安装的包。1. npm 安装配置（可选）新版本的nodejs可以直接使用默认配置的即可，不必须再配置以下的内容。 1. 在nodejs安装的根目录下新建 node_cache 和 node_global 两个文件夹。 2. 分别使用以下命令设置全局的安装包目录： npm config set prefix "D:\Progra.

2021-12-25 23:16:56 24557 7

原创 nginx各种代理配置

记录nginx不同访问路径和代理的配置，注意有加斜杠和不加的区别。综合不同的展示效果，location路径、root路径、alias路径、proxy_pass代理路径，这几个配置路径地址的，全部带上前后斜杠才是最靠谱的。# 进程数量worker_processes 1;events { # 最大连接数量 worker_connections 1024;}http { include mime.types; default_type application/octet-st

2021-12-22 15:05:40 32595 2

原创 webpack打包你的es6模块工具库

1.package.json添加webpack{ "name": "my-utils", "version": "1.0.0", "description": "打包一个es6模块化的工具库", "author": "your name", "main": "./src/index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "build": "we

2021-11-19 17:28:29 1191

原创正则基础使用

正则基础使用定位符：^ 匹配字符串开始位置，如果匹配 ^ 字符，用 \^$ 匹配字符串结束位置，如果匹配 $ 字符，用 \$\b 匹配一个单词边界，即字雨空格之间的位置\B 和\b相反，匹配非单词边界修饰符：i 忽略大小写匹配，如/^\d&/ig 全局匹配，如/^\d&/gm 执行多行匹配，如/^\d&/m特殊字符：$ 匹配字符串结束位置，如果匹配 $ 字符，用 \$() 标记一个子表达式的开始和结束，子表达式可以获取供以后使用。要匹配这些字符本身，使用

2021-05-26 19:09:39 129

原创 js优秀代码片段（持续更新）

es6对数组常用操作1.数组去重// 第一种let array = [1,1,2,3,4,4,5];let res = [...new Set(array)];// 第二种let array = [1,1,2,3,4,4,5];let res = Array.from(new Set(array));// 第三种let array = [1,1,2,3,4,4,5];let res = array.filter((item,index) => array.indexOf(item)

2021-05-26 18:55:42 567

原创 vue.config.js的优化配置

直接上代码配置：'use strict'const path = require('path')function resolve(dir) { return path.join(__dirname, dir)}const name = 'vue Admin Template' // page title// If your port is set to 80,// use administrator privileges to execute the command line..

2021-05-08 15:00:52 2376

原创 vue-cli3+使用prerender-spa-plugin做预渲染

该配置是使用的带前缀的二级目录，网上大多数都是设置publicPath:'/'，这种随便百度一下都有例子可以成功，比如：无访问前缀的spa-plugins配置使用有访问前缀的，会有很多坑，打包一直卡顿，找不到文件等，下面的配置是完全可行的。1.安装spa插件// 先安装一下插件，因为会安装谷歌的一些东西，所以比较卡顿，耐心等等吧npm i prerender-spa-plugin -S2.脚手架的src/main.js配置一下// 创建vue实例new Vue({ rout

2021-05-08 12:22:39 769

原创 nginx配置ssl证书

worker_processes 1; # 进程数量events { worker_connections 1024; # 最大连接数量}http { include mime.types; default_type application/octet-stream; sendfile on; keepalive_timeout 65; server { # 配置监听80端口，通过ip访问可以变为https访问 listen 80; listen.

2020-08-02 14:49:54 448

原创 Centos7安装nginx（非yum方式）

一、官网下载linux版的安装包二、安装需要的依赖#gcc安装，nginx源码编译需要（阿里云的centos已经自带，可以用 gcc -v 命令查看，有了就不用安装）yum install gcc-c++#PCRE pcre-devel 安装，nginx 的 http 模块使用 pcre 来解析正则表达式yum install -y pcre pcre-devel#zlib安装，nginx 使用zlib对http包的内容进行gzipyum install -y zlib zlib

2020-06-01 14:54:33 800

原创小程序仿axios请求封装

一、新建request.js/* * 功能：小程序仿 axios 的请求封装 * * 创建日期：2019-12-23 * 更新日期：2019-12-27 * 作者：GaoShiWei */export default class Request { // 配置项 configure = { baseURL: '', // 请求url地址 header: { 'content-type': 'application/json;charset=utf-8'

2020-05-27 18:29:01 997

原创前端面试题

目录Html相关Css相关JavaScript相关ReactJs相关VueJs相关webpack相关Koa相关Nodejs相关Web相关网络协议相关浏览器相关Html相关什么是文档流？文档流（Normal Flow）：也叫做普通流，就是html元素默认在页面中的排版布局，是相对于盒子模型来说的，比如div从上到下，span和p从左到右排列...

2020-05-26 16:19:32 1773

原创 centOS7的firewall操作

1、firewall常用命令firewall-cmd --state #查看防火墙状态firewall-cmd --reload #重启防火墙(修改配置后要重启防火墙)firewall-cmd --list-ports #查看所有打开的端口firewall-cmd --list-services #查看所有允许的服务firewall-cmd --get-services #获取所有支持...

2020-04-23 16:09:00 289

原创 linux安装nodejs

1.nodejs官网下载编译后的tar包https://nodejs.org/dist/v12.16.2/node-v12.16.2-linux-x64.tar.xz，也可以用wgethttps://nodejs.org/dist/v12.16.2/node-v12.16.2-linux-x64.tar.xz命令来下载2.解压并更改名字tar -xvfnode-v12.16.2...

2020-04-22 19:33:14 287

原创 node+nodemon+express+swig模板渲染配合使用

使用背景：使用node做后台，express做静态资源访问页面，数据用swig渲染到html目录结构：server #服务配置文件 server.js #启动的主文件 router.js #页面跳转的路由配置src #源码目录 assets #资源 imgs css js pages #html...

2019-10-30 15:23:08 369

原创 python项目虚拟环境切换以及安装包

创建虚拟环境在python3.3之前的版本是用virtualenv创建虚拟环境，稍微麻烦一点，3.3之后内置了venv的方式创建，更简单快捷，目前用的是python3.7，使用的是venv方式创建。1.开发环境导出项目的包在根目录：pip3 freeze > package.txt2.在生产环境，把源代码以及包含的package.txt复制到自己的目录下3.创建虚拟环境，在项目根...

2019-08-28 19:18:28 674

原创 python开发web后台项目部署方式

python写的web后台项目的部署不像java直接丢到tomcat部署一样简单，目前比较流行的部署方式有nginx+uwsgi和ginx+gunicorn，如果只是提供后台接口服务，只用gunicorn也可以的。uwsgi和gunicorn是支持WSGI（Python Web Server Gateway Interface）协议的http服务器，gunicorn比uwsgi配置简单，文章用gu...

2019-08-28 15:04:11 2500

原创 python处理http请求

from flask import Flask, jsonify, json, request, render_template# 使用flask的http请求处理模块需要引用 request 的包app = Flask(__name__)@app.route('/')def index(): return render_template('index.html')#...

2019-08-21 12:31:41 2224 1

原创 sublime text3快捷键修改为eclipse

window中修改为eclipse快捷键[ // 关闭所有窗口 { "keys": ["ctrl+shift+f4"], "command": "close_all" }, // 增加一行 { "keys": ["ctrl+alt+j"], "command": "join_lines" }, //跳转到上一个编辑地方 { "keys...

2019-05-01 19:05:42 815 1

原创 js创建对象的几种方式

一、工厂模式function createPerson(name, age) { var obj = new Object(); obj.name = name; obj.age = age; obj.say = function() { console.log(this.name, this.age) } return obj...

2019-02-21 16:09:48 204

原创 Vue开发请求本地json数据配置

原文：https://www.cnblogs.com/daipianpian/p/8025188.htmlVueJS开发请求本地json数据的配置，早期的vue-lic下面有dev-server.js和dev-client.js两文件，请求本地数据在dev-server.js里配置。最新的vue-webpack-template中已经去掉了dev-server.js和dev-client.js...

2019-02-19 10:09:40 1317

原创 commonJS的require/exports和Es6的exports/import的写法

commonJS规范下的export和es6的其实差别还是有一点的，话不多话，专门总结了下面的各种写法。1.commonJS的exports和require的用法## 第一种：exports.say = function(){ }exports.hello = function(){}或者这种写法function say() {}function hello() {}expo...

2019-02-18 21:38:09 610

原创排序算法记录

1，冒泡排序（Bubble Sort）冒泡排序是一种简单的排序算法。它重复地走访过要排序的数列，一次比较两个元素，如果它们的顺序错误就把它们交换过来。走访数列的工作是重复地进行直到没有再需要交换，也就是说该数列已经排序完成。这个算法的名字由来是因为越小的元素会经由交换慢慢“浮”到数列的顶端。 1.1算法描述比较相邻的元素如果第一个比第二个大，就交换它们两个。对每一对相邻元素作同样的...

2019-02-17 21:58:54 185

原创 TCP三次握手和四次挥手

计算机网络OSI模型中网络协议有7层，每一层都有不同的至关重要的作用，7层从上到下分别是 7应用层6表示层5 会话层 4传输层3 网络层 2数据链路层1物理层。TCP（Transmission Control Protocol传输控制协议）是一种面向连接的、可靠的、基于字节流的传输层通信协议。在计算机网络OSI模型中，它和UDP一样属于第四层传输层。TCP是可靠传输的...

2019-02-17 20:08:05 251 1

原创简单聊一下浏览器引擎工作流程

浏览器渲染引擎我们提到的Firefox, Safari两种浏览器构建于两种渲染引擎之上：Firefox使用Gecko —— Mozilla自家的渲染引擎；Safari 和 Chrome 都使用 Webkit。Webkit 是一个开源的渲染引擎，它源自Linux平台上的一个引擎，经过Apple公司的修改可以支持Mac与Windows平台。更多信息可以参考：http://webkit.org...

2019-02-17 15:59:01 420

原创 DNS域名解析的过程

我们知道互联网都是通过URL来发布和请求资源的，而URL中的域名需要解析成IP地址才能与远程主机建立连接，如何将域名解析成IP地址就属于DNS解析的工作范畴。当我们浏览器地址栏输入：www.baidu.com时候，dns域名解析完成大约需要10个步骤，整体可以由一张图来表示：注：比较重要的点知识点专门做了文字加粗1. 浏览器先检查自身缓存中有没有被解析过的这个域名对应的ip...

2019-02-17 14:01:31 619 1

原创 React组件之间通信

目录 React组件之间通信一、父子组件之间的通信二、子组件向父组件通信三、子组件向另外一个子组件通信 React组件之间通信一、父子组件之间的通信这种主要是父组件直接传参子组件，子组件用props接收// 父组件class Animal extends React.Component{ constructor(props){ super(prop...

2019-02-16 17:51:18 291

原创 React-router中使用BrowserRouter跳转后刷新出现404问题的解决

react路由的browserRouter使用的是h5 history API 的高阶路由组件，保证你的 UI 界面和 URL 保持同步。但是有个缺点，一刷新页面就会出现404找不到，原因是本地开发webpack是从内存中读取资源browserRouter从实际引入中并未找到文件。解决方案一：使用HashRouter来跳转，只是url里会带一个#号，不是太美观。解决方案二：修改w...

2019-02-13 17:35:51 4093

原创 web中URI、URL、URN的区别

定义URI（Uniform Resource Identifier，统一资源标识符)是一个用于标识某一互联网资源名称的字符串。该种标识允许用户对网络中（一般指万维网）的资源通过特定的协议进行交互操作。 URL(Uniform Resource Locator，统一资源定位符），最常见的形式是 URI,经常指定为非正式的网址。 URN（Uniform Resource Name，统一资源名...

2019-02-12 16:53:59 489 1

原创什么是前端模块化，组件化，工程化？

1.前端模块化：可以理解为一组自定义业务的抽象封装，是根据项目的情况来进行封装组合到一起的，比如我们可以分为登录模块，评论模块。模块可维护性好，组合灵活，方便调用，多人协作互不干扰。2.前端组件化：指对具体的某个功能的封装，比如所有的分页可以封装为分页组件来统一使用，以此来达到组件复用，提高开发效率。3.前段工程化：概念：指使用软件工程的技术和方法来进行前端项目的开发、维护和管...

2019-02-11 17:06:08 8208

原创 git常用命令

1.拉取项目到本地：转自：https://blog.youkuaiyun.com/qq_38658877/article/details/780425082.基本的一些命令：上传单个文件：git add test.txt 全部上传：git add . 添加注释：git commit -m "备注"上传到远程中央仓库git push -u origin master -f从远程中央...

2019-02-11 16:28:44 199

原创前端开发工程师学习技术点

总结梳理了下高级前端的技术点（对自己的学习路线）：1.jquery，js，html，html5，css3，easyUI，json，ajax，bootstrap，extjs，less，sass，stylus，zepto等常见技术的了解和掌握2.nodejs基本掌握，express和koa2搭建项目3.前端的包管理工具npm，bower的掌握，会自己写npm script自定义脚本4.前端自...

2019-01-21 11:58:24 1294

原创 js中call和apply的区别

首先它们的语法是：call([thisObj[,arg1[, arg2[,[,.argN]]]]]) /*call()方法*/apply([thisObj[,argArray]]) /*apply()方法*/各自的定义：apply：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.apply(A, argsArray); 即A对象调用B对象...

2019-01-21 11:27:46 1077