前端开发工具使用

发表于 更新于 分类于 本文字数： 1.2k 阅读时长 ≈ 1 分钟

vscode来写scss，并且保存时自动生成并更新.css和.min.css文件：安装Easy Sass

自定义vscode分隔符

1
2
3
4
5
6
7
{
  // 如下是被vscode认为是分隔符的字符
  // 我们在设置中搜索editor.wordSeparators
  // 然后根据自己的需要删除不想要的分隔符即可
  // 比如删除-，我们就可以双击选中-分割的class类名
  "editor.wordSeparators": "`~#!@$%^&*()-=+[{]}\\|;:'\",<>/?."
}

快速打印

clo+tab键可以快速打印想要打印的内容，并且会以key,value格式

1
2
// clo + tab
console.log('first', first)

vscode禁止通过拖放来移动选中内容

1
2
// 改为false即可禁止拖动
"editor.dragAndDrop": false

禁止自动合并文件夹

1
2
// 改为false文件夹不会再因为只有一个文件目录而自动合并
"explorer.compactFolders": false

自己动手，丰衣足食，设计不给切图，只好自己来了，记录一些PS坑&&技能

两种方法解决ps错误代码16

1.鼠标右键ps图标，选择“以管理员身份运行”，此时即可打开photoshop
2.鼠标右键ps图标，选择“属性”，
在photoshop属性框中，勾选“以兼容模式运行这个程序”，并在下拉列表中选择“window xp （srevice pack3），点击“确定”保存。
此时再双击ps图标即可打开软件了

永久激活PS

激活方法，目前是2015.5版本的PS

动态创建vconsole移动端调试神器

1
2
3
4
5
6
7
8
<script>
if (location.hostname == "svip-test.jia-expo.com") {
    var script = document.createElement("script");
    script.src = "https://cdnjs.cloudflare.com/ajax/libs/vConsole/3.3.0/vconsole.min.js";
    document.head.appendChild(script);
    var vConsole = new VConsole();
}
</script>

图片占位

https://via.placeholder.com/320x240 即可生成一张320*240的空白图片占位

API请求调试工具

https://hoppscotch.io/