吹口琴的喵-CSDN博客

原创构建docker远程开发环境的Dockerfile

原因由于本地的各项目的依赖环境不一样（npm、node版本等等，所以最终尝试在docker中构建远程开发环境，每个项目之间相对隔绝）。在下载nvm包的时候（git clone https://github.com/creationix/nvm.git），无意间发现了nvm提供了一个Dockerfile的模板，在此基础上进行了一点修改，以供各位参考（其他的关于docker怎么用就不展开）：# Dockerized nvm development environment## This Dockerfi

2021-11-04 16:09:46 692

转载 vscode prettier格式化不生效

问题vscode编辑器中使用了prettier的相关配置，其他项目也都生效了，但是就这一个项目不生效原因参考：https://www.cnblogs.com/shanjinghao/p/12764984.htmlprettier3.7以上会优先读取项目根目录下的editorconfig or prettier config，如果有，就不会使用vscode setting中的设置，所以最好每个项目都配置一个单独的 prettier 配置文件：.prettierrc文件。vscode中prettie

2021-09-16 14:44:28 4882

原创 SSH 配置免密登录

平常每次远程连接的时候，都需要输入密码，而对于办公电脑、私人电脑的话，就会很多余了，所以介绍一下免密登录的方式。客户端生成公私钥上传公钥到服务器测试免密登录1.客户端生成公私钥本地客户端生成公私钥：（一路回车默认即可）ssh-keygen上面这个命令会在用户目录.ssh文件夹下创建公私钥cd ~/.sshls会有两个文件id_rsa （私钥）id_rsa.pub (公钥)2.上传公钥到服务器这里测试用的服务器地址为：192.168.99.20用户为：xxxssh-cop

2021-08-30 09:27:27 333

原创 JavaScript监听DOM元素大小变化

window如果是window的话，可以监听window.resize事件普通dom元素可以通过定时器检查来实现，本文介绍另外一种方案，使用iframe，借助iframe中的resize 事件来监听dom元素的大小变化。<iframe ref="resizeFrame" class="resizeFrame" frameborder="0" ></iframe>.resizeFrame { position: absolute; z-index: -1; le

2021-08-11 14:37:01 3752

原创如何使tinymce在默认情况下粘贴为纯文本

从Tinymce3.4.2开始,你可以简单地:tinymce.init({ plugins: "paste", paste_as_text: true});

2021-08-04 10:07:01 578

原创 powershell下，通过命令打开Git Bash

powershell下，命令打开git-bash& 'C:/Program Files/Git/bin/sh.exe' --login带文件参数& 'C:/Program Files/Git/bin/sh.exe' --login 'file/path'

2021-07-31 12:42:07 1315

原创 vscode中修改默认的终端为Git Bash

windows下，npm项目有的情况下需要执行bash脚本，如果每次都是从文件夹通过“Git Bash Here”打开的话，未免也太繁琐，所以配置vscode的终端为Git Bash，一劳永逸。打开vscode的设置文件，settings.json，添加以下设置： "terminal.integrated.profiles.windows": { "Git Bash": { "source": "Git Bash" } }, "terminal.integrated

2021-07-31 12:37:45 1284 2

原创 Git报错 OpenSSL SSL_read: Connection was reset, errno 10054

最近git提交代码的时候经常报标题所示的错误，网上查了一堆，是网络的原因，然后查github的ip地址，修改本地hosts的指向，但是也不起作用，还影响了我访问github网站。其中还有一个办法经过测试，是有效的：使用git bush打开，然后输入git config --global http.sslVerify "false"，git提交正常了。...

2021-07-29 13:16:34 177

原创 409 Conflict - PUT https://registry.npm.taobao.org/-/user/org.couchdb.user:zphtown - [conflict]

原因是npm设置了淘宝源，切换回来就行了：npm config set registry https://registry.npmjs.org/参考这篇文章：https://blog.csdn.net/adc_god/article/details/77989869

2021-07-22 09:41:24 778

原创 npm清空缓存

在项目安装依赖的时候，出现报错，报错信息是关于缓存相关的信息。尝试清除缓存后再次尝试，成功。清除缓存命令：npm cache clean -f

2021-07-19 17:23:05 326

原创通过vitepress创建的项目，出现乱码的原因

vitepress官网地址：https://vitepress.vuejs.org/然后按照教程创建项目，发现出现了乱码：原因是我创建的index.md的文件格式不是utf-8，然后把文件重新用utf-8格式保存后，问题解决：

2021-07-13 12:01:21 1536 1

转载 VSCODE报错：Property ‘search‘ does not exist on type ‘CombinedVueInstance＜Record＜never, any＞

解决办法：依次点击：文件——首选项——设置，在打开的页面点击，用户——拓展——vetur然后疯狂下滑，找到Validation: Interpolation一栏，看到这里有一句：validate interpolation in region using TypeScript language service大意就是按照TypeScript 的语法规则去校验中的语句。豁然开朗，关闭该选项即可。...

2021-07-12 13:41:19 1084

原创 vite专题：入门

尤大新开发了一个前端工具vite，特地学习一下，官网（有中文版）。按照官网一步一步学习。安装全局安装：npm install -g vite创建项目// use npmnpm init @vitejs/app// use yarnyarn create @vitejs/app然后按照提示，填写项目名称、选择模板。如果想直接指定项目名称和模板，可以通过附加的参数：# npm 6.xnpm init @vitejs/app my-vue-app --template vue# npm

2021-07-12 13:11:20 95

原创 vite：npm run dev报错：spawn esbuild.exe ENOENT

现象在初始化vite项目的时候，按照官网教程执行到npm run dev的时候，出现报错：原因找不到，esbuild/esbuild.exe 这个文件。查了一下，果然没有解决办法解决这个问题的原issue 是在https://github.com/vitejs/vite/issues/1361,一个esbuild的bug那么在当前目录下，执行node ./node_modules/esbuild/install.js，就会生成esbuild/esbuild.exe的文件，然后启动npm ru

2021-07-12 12:17:36 4238 3

原创 vue中$watch的使用（解决RangeError: Maximum call stack size exceeded）

碰到的问题：在一个需求中，对一个表单的更改需要做一个历史记录的功能，由于这个表单非常大（是对一篇文章进行编辑），所以不可能具体到某一个属性，所以采用了watch监听的方法，设置{deep: true}。然而，在预览的时候碰到了RangeError: Maximum call stack size exceeded的错误，经过一番排查，定位到是watch监听引起的，再具体的就不知道什么问题了。即使业务代码什么也没有写，只是简单的console.log也不行。只要设置了deep: true就会报错，非常头疼

2021-07-07 10:25:48 1064

原创安装、升级vue-cli

vue-cli官网https://cli.vuejs.org/zh/guide/installation.html安装vue-clinpm install -g @vue/cli# ORyarn global add @vue/cli查看版本vue --version升级npm update -g @vue/cli# ORyarn global upgrade --latest @vue/cli

2021-07-06 21:36:04 101

原创用 npm 安装 yarn

安装命令npm install -g yarn --registry=https://registry.npm.taobao.org配置一下镜像源：yarn config set registry https://registry.npm.taobao.org -gyarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g

2021-07-06 21:32:34 170

转载 yarn : 无法加载文件 C:\Users\Admin\AppData\Roaming\npm\yarn.ps1,因为在此系统因为在此系统上禁止运行脚本。

解决方法：以管理员身份运行vscode;执行：get-ExecutionPolicy，显示Restricted，表示状态是禁止的;执行：set-ExecutionPolicy RemoteSigned;这时再执行get-ExecutionPolicy，就显示RemoteSigned。

2021-07-06 21:30:49 1291

转载 table中给tr设置border-bottom无效

解决方法：将tr所在table的css样式border-collapse设置为 collapse；比如：table{border-collapse: collapse;}table tr{border-bottom:solid 1px #d0dee5;}

2021-07-02 15:29:54 312

转载 vant3按需引入没样式

根据 vant 教学文档里:https://vant-contrib.gitee.io/vant/v3/#/zh-CN/quickstart安装 babel-plugin-import 插件, 并配置 .babelrc 或 babel.config.js (主目录里有哪个, 就按哪个配) 后:// 原始代码import { Button } from 'vant';// 编译后代码import Button from 'vant/es/button';import 'vant/es/butto

2021-07-01 17:05:51 1231

原创 gyp ERR! find VS的解决办法

在vue create project-name的时候，最后一直在出错，全都是gyp ERR：gyp ERR! find VSgyp ERR! find VS msvs_version not set from command line or npm configgyp ERR! find VS VCINSTALLDIR not set, not running in VS Command Promptgyp ERR! find VS checking VS2019 (16.3.29411.108)

2021-07-01 13:31:46 19258

原创 Chrome浏览器设置font-size为12px以下无效的解决方法

Chrome浏览器将font-size设置为12px以下时无效，字体会默认显示为12px。其他浏览器会正常显示。原因是Chrome浏览器做了限制，font-size 有一个最小值 12px，但是允许把 font-size 设置为 0。这个 12px 的限制用户是可以自行调整的，可以进入chrome://settings/fonts设置为其他值：解决方法：Chrome 29 版本之前，可以使用 -webkit-text-size-adjust: none; 来解除这个限制。29 版本后就不起作用了。

2021-06-30 11:50:39 1359

原创前端几个常用的api文档网站（备份）

框架vue2：https://cn.vuejs.org/v2/guide/vue3：https://vue3js.cn/docs/zh/移动端UI库，vant2：https://youzan.github.io/vant/#/zh-CN/home移动端UI库，vant3：https://vant-contrib.gitee.io/vant/next/#/zh-CN/quickstartpc端UI库，element-ui：https://element.eleme.cn/#/zh-CN/compo

2021-06-25 12:52:56 346

原创 IDE vscode识别webpack中alias配置路径

在vue项目中，有特殊需求的话，除了@用来表示src的话，可能还会有其他的别名。配置方式如下：项目的webpack的配置alias: { '@': require('path').resolve(__dirname, '../src'), '@report': require('path').resolve(__dirname, '../src/views/report')},根目录中的tsconfig.json文件中配置path{ "compilerOptions": {

2021-06-25 10:45:35 329

原创 css为中英文设置不同的字体

项目中，需要为英文、中文设置不同的字体，下面是找到的解决方案：css设置字体div { font-family: 'Microsoft YaHei';}字体规则假如客户终端不认识前面的字体,就自己主动切换到另外一种字体,另外一种不认识就切换到第三种,以此类推.假如都不能识别就调用默认字体。为中英文设置不同的字体依据font-family的字体调用原则我们能够为英文,中文,等两种字体调用不同的字体来渲染。如:’Times New Roman’这两种字体不认识中文,仅仅认识英文,所以,

2021-06-25 10:41:36 4332 1

原创 XMLHttpRequest重新定义的问题

问题项目上线后，遇到了接口请求的问题，提示Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'.debug后发现详情如下：原来XMLHttpRequest是被重新定义了。开发环境下正常的情况应该是这样的：解决下面是适合我的项目的解决办法：项目是基于vue-element-admin二次开发的，然后在项目中全局搜索XMLHttpRequest，果然发现在mock中有redefine

2021-06-25 10:31:52 658

原创 d调简谱一次就好

博客地址：吹口琴的喵（http://m.readers.fun）

2021-03-15 17:05:37 428

转载 Nodejs 操作文件流 fs 同步异步

// 默认读取文件是异步的var fs = require('fs');console.log('begin read a file');var data = 321;fs.readFile('./wechat-menu.json', function(err, data){ data = data; console.log(data);});console.log('finished read a file');console.log(data);console.log('fin

2021-03-03 14:56:36 312 1

转载 node.js中的fs.existsSync方法的使用说明

方法说明：以同步的方法检测目录是否存在。如果目录存在返回 true ，如果目录不存在返回false语法：fs.existsSync(pach);由于该方法属于fs模块，使用前需要引入fs模块 var fs = require(‘fs’);接收参数：（path:将检测的目录路径）var fs = require("fs");var checkDir = fs.existsSync("checkDir");console.log(checkDir);转载自：https://blog.c

2021-03-03 14:28:05 2878 2

转载让网站永久拥有HTTPS - 申请免费SSL证书并自动续期

本文永久地址为什么要用HTTPS相关简介Let’s EncryptCertbot便宜SSL获取HTTPS证书命令行安装Certbot申请证书图形化部署HTTPS证书设置HTTP强制跳转HTTPS命令行下设置证书自动续期附：其它环境下的证书部署Nginx相关命令crontab相关命令参考文档本文永久地址http://www.lucien.ink/archives/81/为什么要用HTTPS网站没有使用HTTPS的时候，浏览器一般会报不安全.

2021-03-03 13:09:32 910

转载本地配置多个ssh key

大多数时候，我们的机器上会有很多的git host,比如公司gitlab、github、oschina等，那我们就需要在本地配置多个ssh key，使得不同的host能使用不同的ssh key ,做法如下（以公司gitlab和github为例）：为公司生成一对秘钥ssh keyssh-keygen -t rsa -C '[email protected]' -f ~/.ssh/gitlab-rsa为github生成一对秘钥ssh keyssh-keygen -t rsa -C 'yourEm

2021-03-03 13:08:08 281

转载 react dom-to-image失真，修改生成后的清晰度

前言最近旧项目发现一个BUG，业务内容是一个弹窗页面的打印功能，因为使用的antd组件库，直接打印dom的话需要修改太多打印样式，所以就想到了把页面转成canvas处理成img元素再用iframe打印。用的是html2canvas，一切正常。直到上个月开始，客户反应打印后的PDF字体都变小了。随即用了很多浏览器测试发现真的字体会比原来的小一号，间距变大。查了资料也没有头绪，不懂为什么，求大神告知是什么原因。总之既然出问题了，那就先改吧。字号变小那我就在生成canvas之前把页面内容字号变大一号打印

2021-03-03 13:06:20 1527 1

吹口琴的喵喵~~的博客