- 博客(6)
- 收藏
- 关注
RSS订阅原创 前端多版本编译时，环境配置的解决思路 及 实现
书接上回测试环境 前端 自动化编译&发布脚本 的 编写 及 原理解析 在最后发现了问题，在本篇中将其解决。 上文中涉及到一个build.sh文件，主要对其改造即可。 #path填写为项目的路径，最好是绝对路径 cd path rm -rf dist npm run build cd ./dist # 编译完成后，生成一个名为config的js文件，一旦被引入，它将被自动执行 echo "window.webConfig={baseUrl: 'your baseUrl'}" >> conf
2020-05-14 16:34:46
496
原创 测试环境 前端 自动化编译&发布脚本 的 编写 及 原理解析
前言 当身处在无jenkins，无Docker，服务器开的是Tomcat ，且服务器不得安装Nodejs，Nginx的情况下，测试环境发布会比较繁琐。很不巧，本人遇到了这样的情况。遂决定撸起袖子，自己写一套发布脚本，顺便学习下脚本语言。本篇为实战记录 一、脚本预期效果 一健实现以下流程： 编译 → 删除服务器源文件 → 发布。 除了一健一条龙，还同时兼容分步执行。所以把每一步独立封装起来。 二、准备工作 准备好脚本编辑器（vscode, vim, 文本编辑器 等等等等）。 基本了解 sh
2020-05-14 16:00:51
771
1
原创 干货分享---console的灵活使用
干货分享—console的灵活使用 一、前言 说到调试语句，比较初级前端程序员通常会不约而同的张口就来：console.log 呗。哐哐哐，往里放就van似儿了。 其实 console 本身除了基本 log 方法之外还有很多其他方法。 针对这些方法，我整理并搬运了一些实用技巧。本篇适合初学前端的同学阅读。 二、你以为简单的 console.log 其实并没有这么简单 标题有点长，哈哈。意思就是对待 console.log 我们也可以不那么简单粗暴。来看下面的。 1.占位符打印参数 console.log('
2020-05-14 15:04:09
280
原创 干货分享---Ant-Icon 集成 iconfont 项目图标库的最佳实践，以React项目为例（仅兼容现代浏览器，未做充分测试）
一、想解决的问题： 随着 iconfont 图标库的增大，项目的体积多多少少会受到影响。我们怎么以最小的代价引用icon？ 怎么让主流icon组件，像<svg/>一样可以设置填充色？ 怎么兼顾icon组件的控制细粒度？ 二、介绍iconfont的的三种引用方式： 翻阅 iconfont帮助文档 后 我们可以知道有三种方式 前两种不加赘述，优点及缺点也显而易见 1、unicode引用 兼容性好是肯定的，可惜空间浪费严重(需要打包字体文件) 用起..
2020-05-13 17:27:05
797
原创 干货分享---通过实现webpack4.x项目拆分 提升 网站 50% 加载速度
前言 在当今的互联网环境下，用户体验俨然成为了革命的刚需。用户怎么判断哪家的产品好用呢？作为网页应用，加载速度一直都是给用户的第一印象。 当然，网页的优化方式有很多。比如 服务器环境（选择高速、高转发率框架 如 Ngnix。选择更先进的协议 如 Http2）、gzip压缩（需要服务器环境支持）、CDN加速静态资源访问 等等等等，都是很好的途径。以上方式，或多或少的需要依赖后端或者运维的支持。甚至会受到所在公司技术栈的制约。 文中提到的将是一种前端工程师可以自由把控的方式。它能让单（多）页应用实现公共部分单独
2020-05-13 17:10:54
329
原创 干货分享---对于需求 “显示文本过长时，只显示{n}行，且缺省部分使用'...'的讨论及全网最终解决方案（React为例）
一、前言 对于这个需求的实现方式，历史上有很多版本。就让我们先讨论一下几种可能。 二、历史解决办法 1.css解决显示文本过长时，只显示单行，且缺省部分使用’…’ .className{ width: 100px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } 当需求只是这样的时候，我们只需要提供这样的样式即可，且兼容大部分主流浏览器。 但是事实往往没有这么简单 2.css解决显示文本过长时，只显示{n}行，且缺
2020-05-13 16:42:09
435
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人