一些遇到的问题
http request header value cann't include line ending character, ensure regex is supported by all browsers, Jetbrains appearance font line-height
node-fetch "xxx is not a legal HTTP header" error
把 header 的 value 写在一个文件里面,编辑器会自动加上 a line ending character (CR or LF),所以在读取的时候需要 trim() 一下。
trim(): include [\r\n\t]
lookbehind is not supported on Safari
在使用正则表达式前需要考虑兼容性,先在 https://regexr.com/ 尝试一下检查兼容性这很重要,比如
/^(([^<>()[\].,;:\s@"]+(\.[^<>()[\].,;:\s@"]+)*)|(".+"))@((?!-)([^<>()[\].,;:\s@"]+\.)+[^<>()[\].,;:\s@"]{2,})(?<!-)$/i;
这个正则表达式网站会爆警告。
How can I change Jetbrains appearance font line-height
?
How can I change the sidebar menu font line-height in new version ?
there is a hidden option that allows overwriting the default line spacing in the tree views, ide.override.Tree.rowHeight
.
- in Help > Find Action, type
registry...
. - open the registry, locate the
ide.override.Tree.rowHeight
key there - set it to some non-negative value, restart the IDE
Jetbrains Preview Tab
类似于 vscode 的功能,在新版默认开启,不是很习惯。Preview Tab 如果没有修改时,跳转时会被替换掉当前 tab。
解决办法有两种:
- 不关闭 Preview Tab 的情况,文件列表操作文件
- 单击 - 预览文件, 预览只有一个选项卡, 如果选项卡是预览状态(文件名是斜体), 就会替换成新的预览文件
- 双击 - 新选项卡打开
- 关闭 Preview Tab 功能,点击 Project => Options, uncheck
Enable Preview Tab
The inferred type of "X" cannot be named without a reference to "Y". This is likely not portable. A type annotation is necessary
When use graphql-code-generator and pnpm to generate code, the below code will throw error TS2742: The inferred type of 'QueryContributionsDocument' cannot be named without a reference to '.pnpm/[email protected]/node_modules/graphql'. This is likely not portable. A type annotation is necessary.
error.
1import gql from 'graphql-tag';
2export const QueryContributionsDocument = gql`.....`;
How to solve the problem? Code like the following will not throw an error.
1import "graphql";
2import gql from 'graphql-tag';
3export const QueryContributionsDocument = gql`.....`;
It can be fixed by installing @graphql-codegen/add to render the missing import statement. Depending on your code generator this could be done through a config file:
1plugins: [
2 'typescript',
3 'typescript-operations',
4 'typescript-graphql-request',
5 {
6 add: {
7 content: 'import "graphql";',
8 },
9 },
10 ],
Using Generic Arrow Functions in .tsx Files
In standard Typescript, you can make an arrow function generic by declaring the type variable before the arguments:
1const identity = <T>(arg: T): T => arg;
However, if you try this in a React .tsx
file, the compiler tries to parse the type variable as a JSX tag, and throw the error: TS17008: JSX element 'T' has no corresponding closing tag.
To help the compiler know that this is actually a generic type variable, put a comma (,
) after the type variable:
1// Note the comma 👇
2const identity = <T,>(arg: T): T => arg;
3// With extends keyword (a way to add default type)
4const identity = <T extends unknow = string>(arg: T): T => arg;
Macbook 使用 CapsLock 切换输入法经常没切换过去 / How to disable caps lock delay
罪魁祸首是 mac 自以为是的“防误触策略”,从上一次输入结束到你按这个键的时间很短,mac 会认为你误触了,因此不响应,并且没有提供自定义的选项让你禁用。
macos 上的 capslock 按键有三种逻辑
非常迅速的短按(随意的一按):什么也不会发生
短按(hold 100ms 左右):切换语言
长按(hold 300ms 左右以上):锁定大写
Karabiner-Elements disables the caps lock delay without any action since v13.3.0. Install from homebrew, brew install --cask karabiner-elements
.
Git 文件默认不区分大小写导致文件冲突
执行命令 git config core.ignorecase false
设置为区分大小写
GitHub Pages 路由如何支持 history mode?
使用 <meta> hack,example: https://github.com/csuwildcat/sghpa, https://github.com/powerfulyang/components/tree/gh-pages
event.path is undefined
https://stackoverflow.com/questions/39245488/event-path-is-undefined-running-in-firefox
https://chromestatus.com/feature/5726124632965120 在 chrome 109 版本删除了 event.path, 可以使用如下代码兼容。
1Existing pages may use the following polyfill to keep functions:
2
3if (!Event.prototype.hasOwnProperty('path')) {
4 Object.defineProperty(Event.prototype, 'path', {
5 get() { return this.composedPath(); }
6 });
7}
https://developer.mozilla.org/en-US/docs/Web/API/Event/composedPath
The path
property of Event
objects is non-standard. The standard equivalent is composedPath
, which is a method. But it's new.
So you may want to try falling back to that, e.g.:
1var path = event.path || (event.composedPath && event.composedPath());
2if (path) {
3 // You got some path information
4} else {
5 // This browser doesn't supply path information
6}