- 博客(20)
- 收藏
- 关注
RSS订阅
原创 Redux + React-Redux + Redux-Thunk 在 React 实际项目开发中使用详解
React 是我们的视图框架，但在大型项目开发的时候需要公用的数据状态是很难管理的，有明显父子关系的组件还比较方便传递值，但没关系的组件传值是非常麻烦的，这时候就需要用到我们的状态管理库 Redux，该文章会讲解在实际React项目开发中redux + react-redux + redux-thunk 组合应用，这也是我们现在企业项目开发中最常用的搭配，让你能够快速应用起来！一、Redux 介绍Redux 是搭配 React 项目开发中最常用的状态管理库，大家知道在我们 React项目开发时，组件.
2020-05-13 14:13:57
469
原创 React Router 基本使用及实际项目使用详解
React Router 是搭配React项目开发时强大的路由库，它可以让你向应用中快速地添加视图和数据流，同时保持页面与 URL 间的同步。一、安装react-route-dom在你的项目中执行npm i react-router-dom来安装reacr-router二、编写最简单的路由在我的项目中App是作为我的根组件的，我编写基本路由就在App组件内，这里根据实际项目来写，有的是写在单独的router组件里。index.js :import React from 'react';.
2020-05-12 16:42:42
786
原创 React Hooks 使用详解及实际项目中遇到的坑
React Hooks 是 React 在16.8版本中更新的新特性，在 React 中一直提倡使用函数组件，老版本中函数组件没有组件实例，没有 state，没有生命周期函数，导致很多情况不得不使用类组件，但是 Hooks 出来后我们可以在不使用类组件的情况下使用state及其他React特性！一. useState1. useState基本使用import React, { useState } from 'react';function Example() { // 声明一个叫 "co.
2020-05-11 16:29:30
3226
原创 基于 Docker + Verdaccio 搭建 Npm 私有库，实现在私有库上发布、下载npm包
公司内部前端组件或库的共享等，搭建一个`npm`私有库就很方便，现在中大型公司也基本都有自己的`npm`私有库，这篇文章，和大家一起共同搭建一个`npm`私有库，共同学习～
2022-01-25 09:58:51
1121
原创 基于 Docker ( Gitlab、Gitlab Runner ) 搭建一整套自动化CI、CD流程，完成从代码提交到自动打包编译到自动部署运行
作为一个前端，以前在公司内接触过搭建成熟的完整CI、CD流程，后来在想是否自己也能搭建这样一套系统，通过学习研究后有了这样一篇博客，和各位一起共同学习。首先大家需要一台服务器，本机电脑也行（推荐2核8G配置以上，因为安装的服务比较占内存）。一、安装 Dockerlinux服务器使用curl下载快速安装的shell脚本curl -fsSL get.docker.com -o get-docker.sh下载完成后，可以ls命令查看一下。已经存在的话，使用sh命令执行这个脚本sh get-doc.
2022-01-25 09:53:48
1372
1
原创 前端工程化之用commintlint + husky实现git提交规范化
在我们团队协作开发时，如果每个人的git的commit提交规范都不一样，最后的代码review或看git的log提交记录时就是一团乱，今天我们用commit + husky实现git提交规范化，保证错误的commit信息不能提交成功。一、在项目中安装commitlint安装依赖npm install --save-dev @commitlint/{cli,config-conventional}生成配置文件echo "module.exports = {extends: ['@com.
2020-05-19 16:06:11
1021
原创 前端搭建自己的脚手架(cli)，实现公司内部前端工程化
我们熟知的vue-cli，create-react-app都是前端圈最知名、最流行、最大众化的脚手架工具，但是我们公司内部开发时一般会对其再封装一些自己的库或者组件等，生成自己的脚手架工具，但大多搭建脚手架的文章都比较复杂，很多时候我们想要就是通过简单的命令能够比较方便的下载到我们的脚手架代码。一、生成脚手架代码模板，并放到github在这里我封装了两个脚手架代码模板：基于vue-cli，封装自己的业务代码及组件等基于create-react-app，封装自己的业务代码及组件等并把他们上传.
2020-05-14 17:02:08
4846
2
原创 cmd中 git log中文乱码解决方法
在win10中，用cmd或者bash中使用git时候，经常遇到乱码问题，网上类似的教程很多，一般可以直接在cmd/bash中输入如下设置命令：git config --global core.quotepath false git config --global gui.encoding utf-8git config --global i18n.commit.encoding utf-8 ...
2020-05-07 16:32:44
386
转载 VUE中使用vue-json-excel超级方便导出excel表格数据
在项目开发时免不了有时会用到表格数据导出excel的功能，以前会用file-saver xlsx script-loader来导出，而且配置非常麻烦，现在用vue-json-excel配置及使用都非常简单一、安装vue-json-excelnpm install vue-json-excel -S二、main.js里面引入并注册使用import JsonExcel from 'vue...
2019-07-18 09:33:32
17767
19
原创 Koa2用户注册生成密文密码及用户登录时生成token返回
项目开发时免不了用户注册和登录的模块，用户生成密文密码保存，及用户登录时密文密码的校验还有token的生成及校验都是很重要的，这篇文章教大家在Koa2开发项目的这块教程！一、用户注册时密文密码生成及校验在需要加密的模块安装并引入bcryptbcrypt是通过hash模式生成密文的模块，且相同密码每次生成的hash密文也不一样，这就比以前MD5的加密模式安全多了，别人基本不可能解密这个...
2019-06-26 10:10:06
1952
2
原创 linux下安装Nodejs+MongoDB+PM2
Node项目上线时需要在Linux下安装Node环境，数据库我这里采用的MongoDB，用PM2来监控并后台运行Node项目一、安装Nodejs1.yum 安装 epel-releaseyum install epel-release -y2.yum 安装 Nodejsyum install nodejs -y3.因为yum安装Nodejs不能安装最新版，所以我们安装个node...
2019-06-24 16:24:11
457
原创 linux安装nginx环境及常用配置和命令
当我们项目上线部署的时候，肯定少不了在linux环境中安装服务器，而nginx就是现在比较主流功能比较强大的一款服务器。这次教程带大家从基础的linux环境一步一步安装nginx，及nginx的常用配置和常用命令。一、用yum进行安装linux必要环境如果你Linux用的很熟练的话，我想这些程序你一定已经用yum安装过了，但是如果你还不熟悉Linux，你可以直接用yum进行安装就可以了。（...
2019-06-24 10:32:28
2696
原创 vue项目打包时做优化处理的办法
vue项目打包时做优化处理的办法在vue项目打包时会生成很多map文件，这是占打包后项目大小的很大一部分map文件的处理我们编辑 /config/index.js 文件，找到其中的productionSourceMap: true,修改为：productionSourceMap: false,将项目打包到子目录刚刚，我们是将文件，打包为根目录访问的。也就是说，必须在...
2019-06-05 17:29:39
1669
原创 chrome浏览器配置解决本地跨域调试问题
chrome浏览器配置解决本地跨域调试问题有时候在项目开发过程中需要在本地开启跨域访问，用这个简单方法就可以实现本地跨域调试关闭chrome浏览器（全部）我们可以通过使用chrome命令行启动参数来改变chrome浏览器的设置，具体的启动参数说明参考这篇介绍。https://code.google.com/p/xiaody/wiki/ChromiumCommandLineSwitch...
2019-05-27 09:19:13
4591
原创 express使用multer实现文件上传功能
express使用multer实现文件上传功能在express框架中想要实现文件上传功能，可以使用multer中间件，该文章教大家具体怎么配置和使用使用之前首先安装 multernpm install multer --save在定义路由前引入const multer = require('multer')设置 dest 属性(设置上传文件后保存的位置)const...
2019-05-24 15:15:46
585
原创 vue中用路由用history模式，在node中的配置方法
vue中用路由用history模式，在node中的配置方法大家知道如果你在 Vue 中使用 hisrory 模式，是无法搭配简单的静态文件服务器的。例如，如果你使用 Vue Router 为 /todos 定义了一个路由，开发服务器已经配置了相应的 localhost:3000/todos 相应，但是一个为生产环境构建架设的简单的静态服务器会却会返回 404。这时。我们有个简单的解决方法，...
2019-05-24 14:52:50
3118
转载 vue中用vuex来管理axios获取到的数据
目前主流的 Vue 项目，都选择 axios 来完成 ajax 请求，而大型项目都会使用 vuex 来管理数据，今天就带大家一起来学习一下 如何在 vuex 中利用 axios 请求数据安装vuex 和 axios ，这里的安装我就不再赘述开始1、Vuex的仓库时 store.js ，我们需要把 axios 引入，并在 action 添加新的方法如图，我们在 store/index.js...
2019-05-12 10:07:36
4211
1
转载 vue中excal表格的导入和导出
注意：vue中要实现表格的导入与导出，首先要install两个依赖，npm install -S file-saver xlsx 和 npm install -D script-loader。其次，在项目src目录下新建一个文件夹vendor（名字随意），在此文件夹下放置两个文件Blob.js和Export2Excal.js（下载地址：http://files.cnblogs.com/fil...
2019-04-26 13:12:48
870
原创 vue移动端开发流程
1、移动端viewport的引入<meta name="viewport" content="width=device-width,initial-scale=1.0" mininum-scale="1.0" maxnum-scale="1.0" user-scalble="no">2、reset.css的引入解决移动端各浏览器样式不一样的问题3、border.css的引入解决...
2019-03-27 09:56:15
1811
1
原创 网页各种meta标签的使用方法及场景
优先使用 IE 最新版本和 Chrome<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>页面描述<meta name="description" content="不超过150个字符"/>页面关键词<meta name="keywords" content=""/>网...
2019-03-26 12:19:10
1071
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人