- 博客(639)
- 资源 (3)
- 收藏
- 关注
RSS订阅转载 vue3 ts方式引入自己的组件报错 Cannot find module ‘xxx‘ or its corresponding type declarations
子组件:<script lang="ts">export default { name: "child",};</script> <template> <div>我是子组件</div></template>父组件(引入子组件):<script lang="ts">const Child = () => import("./components/child");// Cannot find
2021-10-08 17:32:23
15662
1
原创 vue3 TS 使用 component is 动态加载组件的正确用法
<template> <div> <div id="nav"> <ul> <li @click="onCompChange('CompA')">第一个组件</li> <li @click="onCompChange('CompB')">第二个组件</li> </ul> </div> asdfas &
2021-10-08 11:20:19
7214
原创 Windows下用Nginx配置https服务器及反向代理
请求逻辑前端 --> https方式请求nginxnginx --> 通过http请求后端服务安装OpenSSL下载地址然后配置环境变量。在系统环境变量中添加环境变量：变量名：OPENSSL_HOME变量值：F:\OpenSSL-Win64\bin;（变量值为OPENSSL安装位置下的bin目录）生成证书用命令行随便打开一个目录, 使用如下命令生成证书# 创建私钥# test文件名是自己随便起即可, 这个命令会让你设置两次rsa的密码, 请务必记住该密码, 后
2021-09-16 14:53:12
994
原创 google翻译导致站点出现奇怪问题
如果使用谷歌翻译的话，有时候会出现文字错误，数据不对, 甚至功能异常的现象. 我们项目就遇到了这个问题."google翻译"为什么可能会导致网页功能异常?因为google翻译会导致html结构发生变化看这个button的原始的html结构使用google翻译之后的html结构问题与解决方案:问题一: 如果网页的语言与浏览器的语言不一致时,就会出现"google翻译"的图标将网页设置正确的区域语言<!-- 如果是英文网站 --><html lang="en">
2021-08-10 10:10:04
751
原创 解决input=file不能重复上传同一个文件
问题描述：input=file 上传a.txt文件之后再点击上传a.txt文件没反应解决办法：上传成功回调函数里把input的值置空$('input[name=fileuploader]')[0].value=""
2021-08-09 18:23:31
872
原创 自动产出changelog
使用插件列表commitizencz-conventional-changelogconventional-changelog-clistandard-versionconventional-changelog插件安装与配置npm install commitizen cz-conventional-changelog -Dpacakge.json... "scripts":{ "commit": "git-cz", "conventional-changelog": "co
2021-08-02 11:54:46
337
原创 git 标签的创建、删除、查看
标签的特点tag 相当于是一个快照，是不能更改它的代码的。如果要在 tag 代码的基础上做修改，你需要一个分支： git checkout -b branch_name tag_name这样会从 tag 创建一个分支，然后就和普通的 git 操作一样了。查看远程仓库地址git remote -v查看所有标签git tag -lgit tag -n切换到指定taggit checkout tag_name这时候 git 可能会提示你当前处于一个detached HEAD 状态。因为
2021-08-02 10:47:25
382
原创 Math.ceil
Math.ceil() 函数返回大于或等于一个给定数字的最小整数。console.log(Math.ceil(.95));// expected output: 1console.log(Math.ceil(4));// expected output: 4console.log(Math.ceil(7.004));// expected output: 8console.log(Math.ceil(-7.004));// expected output: -7...
2021-07-28 07:25:47
169
原创 clientHeight, scrollHeight, offsetHeight
clientHeight元素客户区的大小，指的是元素内容及其边框所占据的空间大小（经过实践取出来的大多是视口大小）scrollHeight滚动大小，指的是包含滚动内容的元素大小（元素内容的总高度）offsetHeight偏移量，包含元素在屏幕上所用的所有可见空间（包括所有的内边距滚动条和边框大小，不包括外边距)获取浏览器的可视窗口宽高对于Internet Explorer、Chrome、Firefox、Opera 以及 Safariwindow.innerHeight 高度window
2021-07-28 07:24:17
87
原创 用prototype和直接扩展方法/属性的区别, 以及constructor构造器用法
直接扩展的方法/属性,可看做静态方法/属性,只能通过类名访问, 无法通过类实例访问// 定义一个Person类型const Person = function(){ }// 直接扩展一个Person类的属性 personNamePerson.personName = '张三'Person.say = function(){ console.log('我是:'+Person.personName)}// 这里能打印出 张三console.log(Person.personNa
2021-07-26 15:49:47
254
原创 创建自己的cli
写在前面在公司做项目, 每次初始化项目, 基本上都有一些固定的配置，要么每次都重新配置一遍，要么就是配置一次之后，保存到代码仓库中作为模板项目，下次再做新项目的时候，把这个项目下载下来，在这个基础上改。那我一直在想，能不能做成类似vue-cli形式呢? 今天终于让我实现了原理简介package.json的bin属性可以指定默认执行的js在这个默认执行的js中进行编写文件拷贝的代码即可源码pan-cli如果您对nodejs的文件操作不是很明白，请看我的这篇文章 nodejs 文件相关操作参
2021-07-24 19:09:53
95
原创 nodejs 文件相关操作
__dirname__dirname指的是该语句所在文件夹的绝对路径如: 我在D:\demo\abc\test.js中有内容: console.log(__dirname), 那么如果此时用node执行该文件，那么输出的最终结果都是D:\demo\abcpath.resolve与path.joinconst path = require('path')console.log(__dirname) // 如果当前文件所在目录为: E:\workspace\node-testconsole.log
2021-07-24 16:57:19
230
1
原创 js数据类型
8种数据类型js有8种数据类型, 其中6种为原始类型和2种为Object类型6种原始类型Number: typeof instance === “number”Boolean: typeof instance === “boolean”String: typeof instance === “string”BigInt: typeof instance === “bigint”undefined: typeof instance === “undefined”Symbol: typeof
2021-07-23 18:22:21
71
原创 js的push和concat区别
Array.push(...any) : number// 向数组末尾插入元素，并返回数组的最新长度, push会修改原数组Array.concat(...any) : Array// 将any的值合并到数组中, 并返回新的数组, concat不会修改原始数组let arr = ['a','b']console.log(JSON.stringify(arr)) // ["a","b"]let tmpArr = arr.push('c')console.log(JSON.stringify
2021-07-23 17:44:14
289
原创 js中数组方法的reduce的理解
按数组的索引升序，对数组中的每个值执行一次reducer方法，并返回最终结果Array.reduce((pre,cur,index,arr)=>any,[initValue]):any// reduce方法接收两个参数 reduer方法和初始值(pre,cur,index,arr)=>any： 这个就是 reducer方法 的定义。* pre: 表示上一次reducer方法的执行结果, 如果是第一次执行且没有指定initValue, 则pre的值为数组中索引为0的值，如果是第一次执.
2021-07-23 17:28:50
143
原创 vuex actions避免重复执行async方法的逻辑的写法套路记载
import {buildLoadingDictStruct, buildSucDictStruct, DICT_STATUS, needLoadDict} from '@/util/constants'import {DictService} from "@/service/DictService";/** * 字典数据结构 * @type {{data: *[], status: string}} */const dictDataStruct = { // 字典加载状态, 根据这个
2021-07-22 15:45:26
681
原创 element-ui 2.x 按需引入, 按需引入样式, 按需修改主题
按需引入和按需引入样式这里直接按照官网使用babel-plugin-component, 在.babelrc或babel.config.js中新增plugins配置module.exports = { presets: ["@vue/cli-plugin-babel/preset"], plugins: [ // 这个就是 `babel-plugin-component` 的配置 [ "component", { libraryName:
2021-07-21 16:19:24
766
1
原创 egg-sequelize-ts的crud操作
// service/project.tsimport { Service } from 'egg';import { ICountOptions, IFindOptions } from 'sequelize-typescript';import { Project } from '../model/project';import CommUtil from '../util/CommUtil';/** * ProjectService * @author pan * @date 202
2021-07-12 07:46:15
236
原创 webpack gzip 和 nginx gzip的区别
说到前端优化，一般都知道gzip可以进行网络资源压缩, 降低资源在网络中的传输大小。那要如何开启gzip呢? 网上一搜，大部分是类似的结果，先是在webpack中配置CompressionPlugin插件，在打包时就进行一次压缩,生成对应的gz后缀文件，然后是nginx开启gzip功能。上面的说法错误了吗？没有，但是所有都忽略了一个地方，或者说，难道大部分人就没有这么一个疑问，webpack打包时已经进行gzip压缩了，那为什么还要再次开启nginx的gzip压缩呢?经过反复的搜索查找，终于让我找到了
2021-07-11 08:41:46
930
原创 使用vue styleguidist编写组件文档
示例代码地址vue-styleguidist-demo安装与基本配置npm包安装npm install --save-dev vue-styleguidist加入styleguide相关命令package.json{ "scripts": { "styleguide": "vue-styleguidist server", "styleguide:build": "vue-styleguidist build" }}vue-styleguidist serve
2021-07-10 13:34:11
1186
原创 lighthouse脚本
lighthouse http://localhost:8080/ --locale=zh-CN --preset=desktop --disable-network-throttling=true --disable-storage-reset=true
2021-07-07 08:54:27
146
原创 vue项目打包优化
通过splitChunks拆包拆包的目的能够以并行加载js和css能够提取公共的js避免多个包中包含重复的jsconst path = require("path");const apiMocker = require("mocker-api")function resolve(dir) { return path.join(__dirname, dir);}module.exports = { css: { loaderOptions: {
2021-07-07 07:14:46
443
原创 吃透BFC
相关术语三种布局手段: 标准流(normal), 浮动流(float)，定位流(position)BFC: Block Formatting Context, 块级格式化上下文一、BFC的特点1. 在BFC区域内只包含其直接子元素, 不包含孙元素以及更下级元素<div class="bfc-01"> <div class="box-01"></div> <div class="box-02"></div> <
2021-07-06 11:21:16
128
1
原创 WebStorm使用相关
常用快捷键书签添加/删除: F11查看所有书签: Shift + F11删除行 Ctrl+X复制行 Ctrl+D格式化代码: ctrl+alt+L查找类 Ctrl+N查找文件 Ctrl+Shift+N从多个文件查找，可以自定义查找范围 Ctrl+Shift+F查找函数或变量在哪被使用 Alt+F7类，文件，配置项，快捷键，函数，路径等等都能搜索 Shift+Shift展开/折叠 ctrl+shift+ +/-折叠选中的代码的代码 ctrl + ‘.’行移动,上下移动句子 ctrl
2021-07-02 16:33:58
428
1
原创 scss文件中使用深度选择器/deep/报错 Expected selector
有些像 Sass 之类的预处理器无法正确解析 >>>。这种情况下你可以使用 /deep/ 或 ::v-deep 操作符取而代之——两者都是 >>> 的别名，同样可以正常工作。>>>, /deep/, ::v-deep 三个挨个试一次, 哪个可用, 用哪个...
2021-06-30 10:43:20
1595
转载 vue-cli4项目打包时删除console
Terser 去除webpack 内置了 TerserPlugin 用来打包 js ，我们可以在 webpack 官网找到该插件的说明：TerserWebpackPlugin在其 Github 下找到去除 console 的配置项：使用 vue-cli 推荐的链式 webpack 配置法在 vue.config.js 配置中增加：chainWebpack(config) { config.when(process.env.NODE_ENV !== 'development', config =
2021-06-30 07:21:43
525
原创 删除vue-cli保存的模板选项
C:\Users\Administrator，找到文件 .vuerc。（没找到的话 everything 全局搜索.vuerc也行）编辑 .vuerc 文件，把 presets 里不要的选项删除，保存
2021-06-30 07:06:15
642
原创 vue2 使用 storybook 6.x
背景说明在已存在的项目中加入storybook支持, 且该项目是一个组件项目(用于封装独立组件, 供其他项目使用)storybook版本: 6.xvue版本: 2.x引入storybook项目根目录执行: npx sb init执行完成之后, package.json中会增加storybook的devDependencies依赖, 且会新增storybook, build-storybook, 用于开发时运行storybook和对storybook打包运行storybook: npm run
2021-06-27 10:32:24
1209
1
原创 korofileheader 注释插件配置
@ext:obkoro1.korofileheader"fileheader.customMade": { //此为头部注释 "Description": "", "Version": "2.0", "Autor": "pan", "Date": "Do not edit", "LastEditors": "pan", "LastEditTime": "Do not edit" }, "
2021-06-27 07:55:44
872
原创 前端项目相关配置文件
prettier配置文件.prettierrc.jsmodule.exports={ // 一行最多 200 字符 printWidth: 200, // 使用 4 个空格缩进 tabWidth: 4, // 不使用缩进符，而使用空格 useTabs: false, // 行尾需要有分号 semi: false, // 避免报: delete (cr)的错 endOfLine: 'auto', // 在jsx中把'>' 单独放一行 jsxBracke
2021-06-26 17:47:00
517
原创 vscdoe常用快捷键
vscode本身的快捷键大纲查找: ctrl + shift + o大纲重命名: F2分栏: alt + shift + /行跳转: ctrl+g同名字符串批量选择: ctrl+F2文件搜索: ctrl+p命令搜索: ctrl+shift+p收缩代码: ctrl+shift+[展开代码: ctrl+shift+]搜索选中项, 且光标保持在代码编辑器: 选中文本后按 F3逐个选择当前选中的文本: ctrl+d文件上下滚动,但光标不变: ctrl+上/下当前打开文件切换: ctrl+
2021-06-26 11:45:47
505
转载 欢迎使用CSDN-markdown编辑器
欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来，用它写博客，将会带来全新的体验哦：Markdown和扩展Markdown简洁的语法代码块高亮图片链接和图片上传LaTex数学公式UML序列图和流程图离线写博客导入导出Markdown文件丰富的快捷键快捷键加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl
2017-10-21 12:45:07
468
转载 过滤html恶意代码
/** * 转义HTML特殊字符 */ public static final String trunhtml(String html){ if(html == null) return null; final StringBuilder newhtml = new StringBuilder("");
2016-06-30 15:58:31
1796
转载 js/web 日程管理 插件
fullcalendar是一款jQuery日程管理控件，提供了丰富的属性设置和方法调用，官网下载地址http://fullcalendar.io/download，目前最新版本是2.3.2。只要调用$('#calendar').fullcalendar(options)即可初始化，初始化配置中events、eventSources、select和eventClick是必须设置项。event
2016-04-21 13:37:38
10182
4
转载 Java执行外部程序(Apache Commons Exec)
之前使用Runtime.getRuntime().exec调用外部程序，在Tomcat下会有当前线程一直等待的现象。当时为了解决这个问题，使用新建线程接收外部程序的输出信息，详情请看博客http://blog.csdn.net/accountwcx/article/details/46785437。后来在网上找到开源的Java调用外部程序类库Apache Commons Exc
2016-04-21 13:35:42
1585
转载 Java实现Html转PDF
项目上的客户提出一个需求，把政务流程中的表单数据导出成pdf或者图片格式，用来作电子档案材料。表单基于公司的电子政务构建平台实现，在数据库保存的都是html格式，因此打算直接把表单html转成pdf或者图片。由于表单是已经写好了html页面，那我要做的就是能完美解析html+css的pdf生成工具。在百度上搜索html转pdf的结果，大部分都是用itext，itext的确是java开源组件的第一选
2016-04-21 13:32:24
2560
转载 数据一致性-分区可用性-性能——多副本强同步数据库系统实现之我见
新浪微博：@何_登成1 背景 12 问题一：数据一致性 33 问题二：分区可用性 64 问题三：性能 85 总结 106 问题四：一个极端场景的分析 10 背景 最近，@阿里正祥（阳老师）发了上面的一
2016-04-19 17:20:42
1674
转载 一个最不可思议的MySQL死锁分析
死锁问题背景做MySQL代码的深入分析也有些年头了，再加上自己10年左右的数据库内核研发经验，自认为对于MySQL/InnoDB的加锁实现了如指掌，正因如此，前段时间，还专门写了一篇洋洋洒洒的文章，专门分析MySQL的加锁实现细节：《MySQL加锁处理分析》。但是，昨天”润洁”同学在《MySQL加锁处理分析》这篇博文下咨询的一个MySQL的死锁场景，还是彻底
2016-04-19 17:08:20
498
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人