- 博客(22)
- 收藏
- 关注
RSS订阅原创 webpack使用注意事项
默认配置webpack 4 引入了零配置的概念，提供的默认配置来减少重复工作。development 模式下，默认开启了NamedChunksPlugin 和NamedModulesPlugin方便调试，提供了更完整的错误信息，更快的重新编译的速度。production 模式下，由于提供了splitChunks和minimize，所以基本零配置，代码就会自动分割、压缩、优化，同时 webp...
2019-08-27 16:16:04
326
原创 webpack原理（二）自定义plugin
概览Webpack 通过 Plugin 机制让其更加灵活，以适应各种应用场景。 在 Webpack 运行的生命周期中会广播出许多事件，Plugin 可以监听这些事件，在合适的时机通过 Webpack 提供的 API 改变输出结果。我们先看一个最基础的 Plugin 的代码例子：class BasicPlugin{ // 在构造函数中获取用户给该插件传入的配置 constructor(...
2019-08-26 13:47:34
1396
原创 webpack原理(一) 输出文件
说明本文主要参考自 webpack原理，部分源码的分析加入了自己的理解，对webpack感兴趣的同学可以阅读参考文章进一步学习。基本介绍概念在了解 Webpack 原理前，需要掌握以下几个核心概念：Entry：入口，Webpack 执行构建的第一步将从 Entry 开始，可抽象成输入。Module：模块，在 Webpack 里一切皆模块，一个模块对应着一个文件。Webpack 会从配...
2019-08-23 14:03:11
470
原创 React-Native搭建报错：Unable to load script.Make sure you're either running a metro server or that ....
报错Unable to load script.Make sure you're either running a metro server（run 'react-native start' ） or thatyour bundle 'index.android.bundle' is packaged correctly for release.原因我自己这里报错原因是没有找到ind...
2019-06-18 20:48:44
10329
12
原创 React搭建个人博客（二）consul-template+nginx+docker实现负载均衡
一.简介上一篇只讲了博客的前端问题，这一篇讲一下后端的微服务搭建以及cdn的使用。项目的后端使用的thinkjs框架，在我之前的博客中已经写过，这里就不重点说明了。后端项目分为三个：博客前台页面服务端博客后台页面服务端consul-template+nginx实现的微服务网关与负载均衡：其中部署时使用daocloud的stack里，语法基本上就是docker-compose.yml...
2019-06-17 14:21:17
869
原创 React搭建个人博客（一）项目简介与React前端踩坑
一.简介项目最开始目的是为了熟悉React用法，之后加入的东西变多，这里分成三部分，至少三篇博客拆开来讲。前端部分 React React-Router4.0 Redux AntDesign webpack4后端部分 consul+consul-template+nginx+docker搭建微服务 cdn上传静态资源 thinkJs部署部分 daocloud自动...
2019-06-12 19:56:34
3523
转载 consul+docker实现服务发现及网关
前言之前一篇主要介绍了docker+consul实现服务注册功能，本文将主要介绍服务发现以及网关的实现。基本架构registratior监控service web，一旦service web 状态发生变化，通知consul cluster做出相应处理，api gateway 订阅consul cluster 的服务，根据负载均衡的策略，把请求转发到对应web处理。例如用户请求servic...
2019-04-09 19:21:23
1444
原创 consul+docker实现服务注册
基本架构注册中心： 每个服务提供者向注册中心登记自己的服务，将服务名与主机Ip，端口等一些附加信息告诉注册中心，注册中心按服务名分类组织服务清单。如A服务运行在192.168.1.82:3000，192.168.1.83：3000实例上。那么维护的内容如下：简单来说，服务中心会维护一份，在册的服务名与服务ip的映射关系。同时注册中心也会检查注册的服务是否可用，不可用则剔除。服务消费者：即...
2019-04-08 17:46:51
10868
原创 Vue+thinkJs博客网站（二）之thinkJs的使用
一.简介这个个人博客网站最初制作的目的就是练习使用thinkJs，这一篇就主要讲一下thinkJs的一些特性和注意事项。涉及到了文件上传，thinkJs的插件机制，model层建立以及CURD的编写方式等。本项目github地址在这里。项目thinkJs端主要参考了知乎上大神Ischo的文章，链接在这里。二.thinkJs model层写法这里主要讲两个部分，一是表对应的js文件，二是...
2019-02-25 15:54:04
1190
1
原创 Vue+thinkJs博客网站（一）之vue多页面应用的webpack3配置
一.项目简介 本项目使用vue作为前端框架，thinkJs作为后端框架，构建个人博客网站，页面分为博客展示和后台管理，主要目的是学习使用thinkJs。现在只完成了主要的博客增删改功能，发现webpack的配置遇到了一些坑，这里先记录下。项目目录结构如下： 其中system文件夹是前端vue项目的代码，博客展示页面与后台管理页面都在这里，打包成两个页面，具体webpack配...
2019-01-31 17:03:42
585
原创 nodeJs实现文件上传，下载，删除
一.简介 本文介绍了nodeJs+express框架下，用multer中间件实现文件的上传下载以及删除。二.上传 前端使用ElementUI的upload组件实现上传，代码如下： <el-upload class="upload-demo" action="http://localhost:9010/table/uploadFi...
2018-08-15 19:23:32
8893
1
原创 实现下载zip文件（含有模板生成的word）的几种方法
一.介绍 本文使用了apache.tools 实现打包下载，并采用了两种不同的思路来实现。一种是在指定文件夹中生成临时文件，再将这些文件打包下载；另一种是直接将生成的文件直接写入zip的输出流。这里打包的文件有两个，一个是模板生成的word，另一个是 非结构化存储的文件（根据uuid获取）。下面是代码部分二. 第一种： public void exportQuaInfo() thro...
2018-04-28 16:52:49
2028
原创 使用freemarker按模板导出带表格word文档
一.制作模板 1.将word文档制作成以下样式，需要替换的内容放占位符，并按照占位符名字替换数据。表格里，使用RR.XXX的形式的占位符。RR表示当前行对象的名字，XXX相当于对象的属性名。写后台的时候，根据这些名将数据存为map，即名字为键值。例子如下： 2.将word另存为xml格式，这里因为项目需要，我将word保存为.xml 2003。然后将xml文件以标签的形式打开，这里我使...
2018-03-27 19:54:04
5845
原创 使用sql loader把db2表中数据导入到oracle
一.sql loader简介 1.sql loader特点： oracle自己带了很多的工具可以用来进行数据的迁移、备份和恢复等工作。但是每个工具都有自己的特点。 比如说exp和imp可以对数据库中的数据进行导出和导出的工作，是一种很好的数据库备份和恢复的工具，因此主要用在数据 库的热备份和恢复方面。有着速度快，使用简单，快捷的优点；同时也有一些缺点，比如在不同版本数据库之间的导出...
2018-03-12 18:27:45
1210
转载 js单线程与异步
js的单线程和异步前言说到js的单线程（single threaded）和异步（asynchronous），很多同学不禁会想，这不是自相矛盾么？其实，单线程和异步确实不能同时成为一个语言的特性。js选择了成为单线程的语言，所以它本身不可能是异步的，但js的宿主环境（比如浏览器，Node）是多线程的，宿主环境通过某种方式（事件驱动，下文会讲）使得js具备了异步的属性。往下看，你会发现js的机制是多么...
2018-03-09 14:30:37
298
原创 Js Promise的学习
一.我们为什么要用Promise javaScript处理异步都是由callback的形式执行，由js宿主环境（浏览器，node）为一些耗时任务开辟另外的线程。这种callback机制深入人心，但是它的写法会带来一些不便，我们拿ajax举例： $.ajax({ type:'post',url:'xxx.do', data:{}, success:function(data)...
2018-03-09 11:32:57
206
原创 简单介绍前端MVC/MVVM模式特点及区别
一.概述 MVC,MVP,MVVM是三种常见的前端架构模式(Architectural Pattern),它通过分离关注点来改进代码组织方式。不同于设计模式(Design Pattern),只是为了解决一类问题而总结出的抽象方法，一种架构模式往往能使用多种设计模式。 MVC模式是MVP,MVVM模式的基础，这两种模式更像是MVC模式的优化改良版,他们三个的MV即Model，view相同...
2018-03-07 17:11:51
78914
7
原创 Vue组件实现分页
一.介绍 本方法利用vue的父子组件实现分页功能，UI来自bootstrap。实现效果是最大页数小于五时全部显示，分页只显示五个页数，具体页码显示范围根据当前页与最大页数来变换。效果如下图所示： 二.子组件部分 Vue.component('page-divide',{ props:['index','maxpage','curpage'], co...
2018-03-06 17:12:26
7532
原创 PL/SQL 连接数据库时报错以及导入导出表闪退问题
一.PL/SQL登录时报错 最近遇到了两种登录时报的错 1.ORA-12514 listener does not currently know of service requested in connect description 2.ORA-12514 no listener 尝试了网上的各种方法，最终如下方法比较有效。做法是在oracle11g安装目录下找到liste...
2018-03-06 09:41:50
3726
原创 JointJS处理两条线的交点
一.问题概述 使用jointJs绘制流程图时，如果两条连线相交，这两条线不会像Viso一样，对交点进行处理（交点处有弧线）。虽然鼠标选中连线时，单条线会有自动点亮的效果，但是在客户强烈要求下（！！！），我还是做了保存时对两条线交点的处理。 本处理方法生效有几个前提 1.本方法实质是在保存时，把连线的属性vertices(即保存折点信息的属性)改变,并存到数据库。所以只适用于保存时...
2018-03-05 20:06:07
1718
转载 CSS3 Media Queries
Media Queries直译过来就是“媒体查询”，在我们平时的Web页面中head部分常看到这样的一段代码： <link href="css/reset.css" rel="stylesheet" type="text/css" media="screen" /> <link href="css/style.css" rel="stylesheet&
2018-03-05 17:52:21
155
原创 CSS3 内容属性content学习
1.定义和用法 css2中已经定义了content属性，此属性与:before选择器和:after选择器配合使用，将生成的内容放在一个元素内容的前面或后面。2.基本语法 normal ： 默认值。 string ： 查入文本的内容，一般是一个字符串。 attr() ： 插入元素的属性值，语法：attr(attribute)。 url() ： 插入一个外部资源文件，可以是图...
2018-03-05 15:55:18
600
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人