- 博客(36)
- 收藏
- 关注
RSS订阅原创 开发nodebb插件的一点个人经验
最近在公司搭了个nodebb的论坛，由于种种原因，需要接入公司的域账号系统，于是就有了这次开发的经历，但是相关资料太少，特此记录下踩坑学习历程，这些都是业务用到的内容记录下，业务，没涉及到的内容没有太多了解。开发中，如果更新的是library服务端相关的插件代码，要重启下nodebb查看效果，如果更新的是client客户端相关的代码，要重新构建下静态资源。集成到了nodebb服务中，集成后在nodebb后台管理的插件列表中能看到已安装该插件。进入镜像容器，这个镜像中没有git，所以我将我开发的插件压缩成。
2024-10-17 16:09:20
477
原创 利用前端知识将excel文件中的数据转为想要的JSON数据思路
这个东西想了很久，要不要写一下呢，技术没啥难点，但是自己觉得确实有点意思，算是提供一个思路吧这个业务场景可能很少会碰到 哈哈。
2023-03-29 14:29:31
2746
原创 记webpack3.x版本远古老项目编译优化实战
记webpack3.x版本远古老项目编译优化实战为何要优化？每次执行npm run dev 需要等待24~28s，每次ctrl + s触发热更新需要等待4~8s!叔可忍！婶婶不能忍！优化前的编译速度优化前的热更新速度实际只会比这些更慢！！！优化之后写代码又感到了人生的幸福！优化后的编译速度8s左右结束战斗！优化后的热更新速度秒更新 有木有！优化思路使用happypack来加快babel-loader编译速度首先 安装 happypack npm i
2021-03-18 10:13:28
2894
3
原创 记一次webpack5从0到1改造老项目的过程
记一次老项目添加webpack的过程目录结构改造前改造后为什么要改造？老项目痛点在哪里？老项目技术栈使用纯原生，需要兼容IE10，没有引入帮助插件老项目css与js没有通过postcss与babel进行转化 容易产生兼容错误老项目特殊需求静态资源如图片、图标、等需要打包到js文件中，每次新增都要自己转化，很麻烦老项目JS代码全冗杂在一起，不模块化，不够清晰。老项目与自动化打包构建工具合作不太方便老项目没有使用scss等css工具老项目没有使用eslint 也没有格式化代
2021-03-16 15:26:06
2661
原创 Vue2.x与@vue/compositio-api上手指南
@vue/composition-api分享该API现已稳定！???? 当迁移到 Vue 3 时，只需简单的将 @vue/composition-api 替换成 vue 即可。你现有的代码几乎无需进行额外的改动。动机与目的更好的逻辑复用与代码组织随着功能的增长，复杂组件的代码变得越来越难以阅读和理解。目前缺少一种简洁且低成本的机制来提取和重用多个组件之间的逻辑。更好的类型推导Vue 当前的API 在集成 TypeScript 时遇到了不小的麻烦，其主要原因是 Vue 依靠一个简单的t
2020-07-10 21:41:10
11296
6
原创 使用gltf-pipeline的draco压缩gltf报Draco encoding failed.
查阅这个issue得到了解答。glTF 2.0 model fails to compress with Draco compression简单的来讲就是建模建的模型没有三角化处理，让建模把模型全部三角化就行了。...
2020-04-08 13:50:28
3011
原创 Cesium在Vue中加载Draco压缩后的gltf模型
走了很多弯路首先找到node_modules/cesium/ThirdParty目录找到draco_decoder.wasm文件。在项目根目录下的public目录下新建ThirdParty，将draco_decoder.wasm复制进去，然后加载模型的时候什么都不用改，还是model:{ url: '模型目录'}就可以加载Draco压缩后的gltf模型了。其实就只解析压...
2020-03-23 13:17:17
3738
6
原创 ThreeJs做智慧城市项目后记
随着时间的推移技术的进步，前端越来越杂了，但是也越来越精彩了。只是会用一点ThreeJs，对于WebGl的原理并没了解过，这并不影响我们利用ThreeJs去做出一个非常炫酷的项目。开始新世界的大门打开啦！写在前面不要因为不了解就被这种3D展示的项目给吓到 其实实现起来很简单 很简单 很简单城市模型一份 最好是gltf模型，obj模型也没问题，我会介绍如何转化与压缩 PS:为什...
2019-11-04 14:24:31
47462
71
原创 Threejs 加载模型贴图不显示，只显示黑色的模型，也没报404错误的解决方案
看看是不是坑爹的建模把颜色材质颜色设置成黑色了！颜色贴图。默认为null。纹理贴图颜色由漫反射颜色.color调节。贼坑
2019-10-16 17:32:44
7518
1
原创 Nuxt使用prettier和eslint格式化代码时提示Delete `␍`eslint(prettier/prettier)
在项目根目录下的.prettierrc文件中写入即可"endOfLine": "auto"prettierWhy do I keep getting Delete ‘cr’ [prettier/prettier]?
2019-08-22 18:05:28
11151
2
原创 nodebb Apache配置ssl导致websocket/wss失效(400)解决方案
请确保apache 最低版本2.4以上参考官方proxy文档 配置443端口Configuring Apache as a proxy<VirtualHost *:80> ServerName www.example.com ServerAlias example.com # Rewrite any http traffic to the main u...
2019-08-10 10:38:17
1086
原创 Threejs + Videojs/原生video/第三方播放器 实现全景视频/全景直播播放DEMO
原理原理其实很简单，做过全景图的同学都知道，球模型+全景图片贴图。 全景视频/全景直播就是 球模型+全景视频素材 。至于播放器样式，可以自己用Js+Dom自定义，或者更改videojs的样式 即便你是用原生video也是可行的 threejs官方demo就是原生video标签。本demo就是拿着threejs的demo改的<!DOCTYPE html><html ...
2019-06-03 13:23:51
19028
13
原创 vue/react使用JSDoc、jsconfig.json 完成vscode对于webpack的alias引入的js方法的提示
TS有个好处就是你引入方法会告诉你参数是什么类型返回什么类型首先你需要阅读JSDoc的文档和jsconfig.json的配置，你也可以百度下中文的文档比如我的webpack的alias配置如下, common中是我的公共方法chainWebpack: config => { config.resolve.alias .set("@common", resolve("...
2019-04-27 15:22:57
5629
2
原创 vue-particles IE报错babel不能转es5的折中解决方案（vuecli3如何给js设置loader的include）
报错因为babel没有转不同的vue-cli有不同的将该插件加入到babel中的方法在vue-cli3中const path = require("path");const resolve = function(dir) { return path.join(__dirname, dir);};module.exports = {chainWebpack: config =&g...
2019-03-11 14:07:04
5222
7
原创 React-Router4 嵌套路由实现的两种方式以及路由过渡动画的实现方式
刚学习react的路由 一个小的后台管理demo目录结构// 后台管理页面通常有两种布局方式 // 一种是没有导航栏的 登录页面// 一种是含有导航栏的 各功能性页面 // 导航栏不需要每次都渲染 Layout中含有导航栏 和 传递进来的子组件即可// 大致思路就是 登录页面和Layout页面同级 切换路由的时候 切换Layout中的子组件src pages Layou...
2019-03-08 09:38:54
1903
2
原创 Vue使用百度分享，组件切换、销毁分享失效的解决办法
销毁分享组件，再重新建立分享组件，发现分享按钮不见了查了一些资料 什么 重设config啥的 都不行后来发现了init方法顾名思义 重新初始化一下就行了 也不要重新去添加标签使用百度分享的init方法/* eslint-disable */export default { mounted() { // 关键代码在这里 如果已经加载了 就init它 没有加载 就初始化 ...
2019-01-03 14:13:52
1111
原创 JS判断浏览器是否缩放（参考斗鱼源码）
// 翻斗鱼的源码看到的 define("douyu/com/zoom", ["jquery", "shark/observer", "shark/util/cookie/1.0", "shark/util/storage/1.0", "douyu/context", "d
2018-12-15 14:35:31
1273
原创 静态页面、伪静态页面、SPA、SSR、预渲染之间的联系
写在前面，本文是我查阅资料得出的粗略理解，如有不对请指正，感谢！查阅资料得知 爬虫对URL和查看网页源码时候查看到的DOM结构有很强的依赖关系SPA页面众所周知查看网页源码后，除了你写的index.html里面的内容 没有生成的真实DOM结构（通过JS动态增删，部分搜索引擎拿不到这些），而且url不用history模式，生成的都带#号，完全不利于SEO而SSR服务端渲染，就拿Nu...
2018-12-04 11:00:38
3097
原创 Vue使用highCharts的仪表盘等扩展
<template> <div> <div id="highCharts" style="width: 400px; height: 300px;"></div> </div></template><script> // 最主
2018-05-25 20:39:42
2301
原创 VUE使用viewerJS
viewerjs —- github 传送门import viewer from 'viewerjs'// 取得css文件 我这个写法很lowimport '../../../../node_modules/viewerjs/dist/viewer.min.css'export default{ data() { return { ...
2018-05-10 17:28:10
11910
原创 解决在Iframe中切换页面闪动的问题
很简单 那就是——加入淡入动画！css中给body设置opacitybody{opacity: 0; transition: opacity 0.2s}body.active{opacity: 1}js中让body显示$('body').addClass('active')整个页面切换的时候就会如丝般顺滑不可思议...
2018-03-02 14:22:33
12130
1
转载 BFcache
BFcacheH5浏览器和webview后退缓存机制（转载） http://www.jianshu.com/p/1557c4b737e1 You Do Not Understand Browser History http://madhatted.com/2013/6/16/you-do-not-understand-browser-history H5浏览器和webview后退缓
2018-02-05 10:03:18
712
原创 手把手教你利用前端字体文件(.ttf)混淆数字来阻止爬虫爬取网站数据
利用字体文件混淆数字 展现给用户正确的数字 而在dom结构中是混淆的数字看的是对的 但是爬到的确是错的前端防爬虫！
2017-12-21 15:54:50
9061
8
原创 前端JS将文字替换成伪类标签防爬虫的一个方法
话不多说 思路就是 把重要的信息转换成伪类标签 显示出来 把原有的文字删除 本来还担心替换成伪类标签后字体什么的会改变 伪类标签很好的继承了样式 上代码/**@param {String} -- cls 当前要替换的标签名 比如我要替换所有p 标签下的 span 的字为伪类标签 就是 CreatePseudoClass( {cls: 'p span'} );*/function
2017-12-13 17:26:16
3008
2
原创 VUE+Webpack 实现懒加载的三种方式
第一种 引入方式 就是正常的路由引入方式const router = new Router({ routes: [ { path: '/hyh', component: hyh, name: 'hyh' } ]})第二种const router = new Router({
2017-12-06 09:24:24
14352
原创 JS(JQ)实现table表格固定表头且表头可以随横向滚动而滚动
先看一张效果图 思路： 1、头部用一个table并用一个div包裹着， 表格的具体内容用一个table 2、头部外面的div用positon: relative相对定位 3、获取整个表格的高度 4、获取表格的dom（或者包裹着表格的dom）距离页面顶部的距离 offsetTop 5、滚动的零界点的距离 表格的高度+表格距离页面顶部的距离 如果滚动
2017-10-25 21:28:59
10426
原创 css实现 display: none和display: block的切换动画
话不多说先上代码.index-detail-list .item-contain{ display: none; overflow: hidden; padding: 14px 14px 9px; border: 1px solid #ececec;} .index-detail-list .item-contain.active{ display: bl
2017-10-19 09:33:35
43224
7
原创 基于JQ 根据输入内容自适应输入框高度 支持输入增高 渲染时设置高度和内容一致
// 调用方法bootText('textarea', 50) // 第一个参数是class 或者 id 第二个参数是这个class或者id对象的最小高度function bootText(cls, minHeight){ var idArr = $(cls); // 获取传进来的class或者id $.each(idArr, function(k, v) { // 循环遍历 为每
2017-06-28 22:48:33
1397
原创 仿新浪微博@功能 JS的实现 ——使用JQ At.js 和HTML5 contentEditable
项目需求 增加@功能 先上效果图Atwho.js gitHub地址 https://github.com/ichord/At.js需要引入的JS： <script type="text/javascript" src="jquery.caret.js"></script> // 这个JS插件用来获取光标位置 <script type="text/jav...
2017-05-25 16:34:57
7882
2
原创 移动端将base64传给后台，后台解析出的图片一部分是白色的
base64在手机端如果存储到input的value里面 input会截断太大的部分 导致后台收到的base64无法正确解析或者一部分是白色的
2017-05-13 14:51:30
2719
转载 npm安装淘宝镜像
这个也是网上搜的，亲自试过，非常好用！镜像使用方法（三种办法任意一种都能解决问题，建议使用第三种，将配置写死，下次用的时候配置还在）:1.通过config命令npm config set registry https://registry.npm.taobao.org npm info underscore （如果上面配置正确这个命令会有字符串response）2.命令行指定
2017-03-16 11:36:46
1490
原创 MUI + Nodejs + Mongodb 图片上传的使用总结 （我写的是头像上传 一样的都是）
如何用Nodejs + Mui +Mongodb 做图片的上传 和一些心得
2017-03-12 16:00:42
2825
原创 Express、Nodejs服务器上传文件时出现Unexpected field
我出现这个问题是因为用了 multer模块 死活读不到上传的文件， 后来查了说是这个模块没法读取文件 于是采用了 connect-multipary要上传文件 不要用multer ！要上传文件 不要用multer ！要上传文件 不要用multer ！var multipart = require('connect-multiparty'); //在处理模
2017-03-09 16:48:08
7052
5
原创 nodejs+mongodb写的一个简单的登录注册
自己自学Nodejs 中 随便写着玩的 没学到数据集过滤 就自己想了个笨办法还不完善 自己练手了----------------------------------------------------------------------以下是服务器代码 server.js-----------------------------------------------------
2017-02-26 21:00:28
1598
原创 CSS3 仿京东边框从中间逐渐放大效果
昨天看一个朋友发的京东的效果 然后就自己扒了下来 确实感觉到css3的强大 话不多说 贴代码 #box{ width: 300px; height: 300px; transition: all 5s; position: relative; } #box ::before{ co
2017-02-16 08:50:36
3528
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人