自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(8)
  • 收藏
  • 关注

原创 React与D3的结合

前言前段时间公司有个需求要开发一个数据关系的界面,类似UML建模工具里面表之间关系的图形界面,目前用的前端框架是React、rxjs,图形界面这块定下来采用的是D3的最新版本V7,所以现在需要基于React框架下开发这个界面,前期查了一些相关资料,国内基于React、D3 V7版本结合开发的比较少,差不多都是V3、V4版本,V4版本国内还有中文翻译V4之后就停了,所以结合个人在当前的需求背景下以及使用过程中的碰到的一些问题记录下来,一方面供有需要人的可以借鉴下,一方面也是给自己做个总结。用的D3版本

2021-07-24 10:23:30 1239 2

原创 前端项目搭建部署全流程(五):基于Jenkins与gitea的自动化部署

1. 前言继上一篇文章之后,我们可以基于写的脚手架工程初始化一个项目工程,然后基于这个工程提交搞Gitea服务,实现基于Jenkins的自动化部署与Gitea的webhook钩子,以便在执行git push的时候,自动构建项目。2. 搭建Gitea托管服务器下载Gitea安装文件 https://dl.gitea.io/gitea, 我下载的是gitea-1.13.1-windows-4.0-amd64.exe版本下载完成后,在本地磁盘建立一个Gitea目录,然后在该目录下执行安装文件然后打开l

2021-02-20 17:28:15 824

原创 前端项目搭建部署全流程(四):脚手架与业务模块构建

1.前言继上一篇文章之后一个简单的React项目模板已经搭建好了,这篇文章主要写一下简易脚手架以及业务模块的生成命令行,以往我们使用较多的是vue-cli、create-react-app等开源脚手架,但是这些脚手架不一定符合我们当前使用的环境(比如公司的通用脚手架),这个时候我们就需要针对使用环境搭建一个脚手架,来提升整体的开发效率。为什么要使用脚手架?简单描述几点:减少重复的工作,不需要在内部通过ctrl+c、ctrl+v的方式复制项目结构可以保持整个工程的项目结构以及编码规范保持一致

2020-12-26 17:17:53 479

原创 前端项目搭建部署全流程(三):项目代码规范

1.前言继上一篇文章基本已经搭建完一个简单的React项目的,这边文章主要是讲项目的代码规范2.使用eslint规范代码2.1.安装依赖yarn add eslint @types/eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin --deveslint eslint核心代码@types/eslinteslint的类型定义@typescript-eslint/parsereslint解析器,用于解析typesc

2020-12-14 23:10:16 464

原创 前端项目搭建部署全流程(二):webpack配置

1.前言上一篇文章已经简单的配置了一些webpack的配置,这一篇文件主要是基于项目增加一些loader的处理,后续根据实际使用情况在继续更新配置2.webpack CSS配置2.1.安装依赖yarn add css-loader style-loader --devcss-loader 会对 @import 和 url() 进行处理,就像 js 解析 import/require() 一样style-loader把 CSS 插入到 DOM 中2.2.webpack配置module: {

2020-12-01 18:02:02 234

原创 前端项目搭建部署全流程(一):搭建React项目

1.前言前段时间突发一个想法,想尝试从零开始搭建一个React项目模板,发布到GitHub,再编写脚手架命令拉取模板以及编写脚本命令快速生成业务模块,然后再用这个模板结合之前的一套组件库,完成编译打包运行一些列操作,再就是另外一个大事,用基于这个项目模板与组件库构建的项目,搭建自动化构建与自动化部署整个流程,将连载文章记录整个这个流程,以便后期回溯。2.初始化项目新建项目文件然后执行命令,-y 需要选择的地方默认是yes,执行完后会生成个package.json文件npm init -y3.初始

2020-11-25 23:11:56 998

原创 JavaScript对象:面向对象还是基于对象?

与其它的语言相比,JavaScript 中的“对象”总是显得不那么合群。一些新人在学习 JavaScript 面向对象时,往往也会有疑惑:为什么 JavaScript(直到 ES6)有对象的概念,但是却没有像其他的语言那样,有类的概念呢;为什么在 JavaScript 对象里可以自由添加属性,而其他的语言却不能呢?甚至,在一些争论中,有人强调:JavaScript 并非“面向对象的语言”,而是“基于对象的语言”。这个说法一度流传甚广,而事实上,我至今遇到的持有这一说法的人中,无一能够回答“如何定

2020-11-25 23:11:04 183

原创 Rollup打包React组件库并发布到npm私服

背景公司的前端组件库经过前端好几位大佬搞了个基于React、Ant design二次扩展的库,之前设想是每个业务模块基于公共的组件库维护各自的业务组件库,经过几个周期之后,发现已经不可控了,每个业务模块的Ant design版本不一样,而且各自基于公共又搞了一套自己的库,为了收紧口子跟后期的维护扩展,决定把公共库打包发布到npm私服,然后install到各自业务线,确保各业务线一致,这是背景打包在这之前有使用rollup打包的经验,这里也计划用rollup来实现,这过程中碰到了不少问题,查阅相关资料发

2020-11-25 23:09:01 1273

空空如也

空空如也

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

TA关注的人

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