开发编辑器进阶使用.md
[toc]
0x00 前言
俗话说:工欲善其事,必先利其器,作为一名开发必需要要一个得心应手的开发工具,比如下面的:
- VScode : 轻量级的开发工具
- IntelliJ IDEA Pycharm : Python项目开发必备;
- IntelliJ IDEA JAVA : Java 开发项目推荐
- Eclipse JavaEE IDE : Java 开发必备
1.Visual Studio Code 编辑器
在前端开发中,有一个非常好用的工具,Visual Studio Code,简称VS code。
VS vode特点:
- 开源,免费;
- 自定义配置
- 集成git
- 智能提示强大
- 支持各种文件格式(html/jade/css/less/sass/xml)
- 调试功能强大
- 各种方便的快捷键
- 强大的插件扩展
官网 :https://code.visualstudio.com/ github地址 :https://github.com/Microsoft/vscode
1.1 VS 安装插件
如何进入扩展插件下载? 方法一:按F1或Ctrl+Shift+p,输入extensions 方法二:ctrl + P 然后输入 >ext install 方法三:ctrl + shift + X
vscode常用插件:
P0.设置移植
Chinese (Simplified) :中文(简体)语言包
Settings Sync : 使用GitHub Gist同步多台计算机上的设置,代码段,主题,文件图标,启动,键绑定,工作区和扩展。
Visual Studio Keymap : VS使用者迁移到VS-Code
P1.主题美化:
One Dark Pro : Atom标志性的One Dark主题,也是VS Code下载次数最多的主题之一
Atom One Dark Theme : 基于Atom的黑暗主题
Night Owl : 一个非常适合夜猫子的 VS Code 主题。像是为喜欢深夜编码的人精心设计的。
P2.文件图标:
vscode-icons : 目前该插件已被vscode内部支持:"文件" -> "首选项" -> "文件图标主题"
P3.高效管理项目:
Project Manager :定义自己的收藏项目,或选择自动检测VSCode项目,Git,Mercurial和SVN存储库或任何文件夹。
P4.自动格式化代码:
beautify :美化javascript,JSON,CSS,Sass,和HTML在Visual Studio代码
guides : 显示代码对齐辅助线(内置存在)
Rainbow Brackets: 为圆括号,方括号和大括号提供彩虹色。这对于Lisp或Clojure程序员,当然还有JavaScript和其他程序员特别有用。
Bracket Pair Colorizer: 用于着色匹配括号
Indent-Rainbow: 用四种不同颜色交替着色文本前面的缩进
P5.搭建各类语言开发环境:
Code Runner: `Run C, C++, Java, JS, PHP, Python, Perl, Ruby, Go, Lua, Groovy, PowerShell, CMD, BASH, F#, C#, VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml, R, AppleScript, Elixir, VB.NET, Clojure, Haxe, Obj-C, Rust, Racket, Scheme, AutoHotkey, AutoIt, Kotlin, Dart, Pascal, Haskell, Nim,`
P6.代码调试联调:
Debugger for Chrome : 从VS Code调试在Google Chrome中运行的JavaScript代码。
REST Client:REST客户端允许您直接发送HTTP请求并在Visual Studio Code中查看响应。
P7.自动检测代码规范:
HTML Snippets : 完整的HTML代码提示,包括HTML5
HTML CSS Support:在 html 标签上写class 智能提示css样式
jQuery Code Snippets : 超过130个用于JavaScript代码的jQuery代码片段
HTMLHint:html代码检测,支持html5
Atuo Rename Tag : 修改 html 标签自动帮你完成头部和尾部闭合标签的同步修改
Code Spell Checker:代码拼写检查器,与camelCase代码配合良好的基本拼写检查程序。
Todo Tree:扩展可以快速搜索(使用ripgrep)您的工作区以获取TODO和FIXME等注释标记,并在资源管理器窗格的树视图中显示它们
P8.提升React等前端开发的效率:
npm intellsence : 用于在 import 语句中自动填充 npm 模块
path Intellisence
TypeScript Hero
Import Cost : 对引入的计算大小(node.js)
Path Intellisense : 可自动填充文件名。
P19.信息设置
filesize:在状态栏中显示当前文件大小,点击后还可以看到详细创建、修改时间
GitLens:git日志查看插件增强了 Visual Studio Code 中内置的 Git 功能。
P10.高级功能
Azure Storage:VS Code的Azure存储扩展允许您部署静态网站并浏览Azure Blob容器,文件共享,表和队列
p11.其他常用插件
Paste image : markdown粘贴图片
语言开发环境
C/C++环境
code runner插件默认的c/c++编译器是gcc/g++需要提前安装好并且设置好环境变量,通常选择MinGW或者MinGW-w64,建议选mingw-w64
离线版本x64:https://sourceforge.net/projects/mingw-w64/files/Toolchains%20targetting%20Win64/Personal%20Builds/mingw-builds/8.1.0/threads-posix/seh/x86_64-8.1.0-release-posix-seh-rt_v6-rev0.7z/download
离线版本x32:https://sourceforge.net/projects/mingw-w64/files/Toolchains%20targetting%20Win32/Personal%20Builds/mingw-builds/8.1.0/threads-posix/dwarf/i686-8.1.0-release-posix-dwarf-rt_v6-rev0.7z/download
#环境变量
setx PATH "%PATH%;D:\Builder\mingw64\bin"
#编译
g++ demo.c -o demo.exe
WeiyiGeek.
#java
language Support for Java(TM) by Red Hatredhat.java
Java Extension Pack : 流行的扩展,可以帮助在Visual Studio Code中编写,测试和调试Java应用程序
Spring Boot Extension Pack
Language support for Java ™ for Visual Studio Code
#C# : 适用于.NET Core的轻量级开发工具。伟大的C#编辑支持,包括语法突出显示,智能感知,转到定义,查找所有引用等。
CodeMetrics:计算TypeScript / JavaScript文件的复杂性。
VUE插件 :
1.2 VS 常用快捷键
Ctrl+, #界面设置
Ctrl+` #设备终端`
Ctrl+ H #进行字符替换和正则替换
Shift + tab # 删除多行缩进 (常用)
Ctrl+ SHIFT + P #命令面板
Ctrl+Shift+X #打开扩展
Ctrk + K + S # 快捷键设置首页->首选项->键盘快捷方式
1.3 VS 常用设置
问题1:Classpath is incomplete. Only syntax errors will be reported; 产生原因:当打开一个独立的java文件,不属于任何项目VS code的Java扩展将无法计算出正确的类路径,因而报告错误:“Classpath is incomplete. Only syntax errors will be reported.” (但这对独立的java文件而言毫无意义),实际功能不受影响。
#解决方法
修改用户空间 .settings.json 与
"java.errors.incompleteClasspath.severity": "info"
#2.导入一个真正的项目(包含pom.xml, build.gradle 或者 eclipse的配置文件),以便可以设置完整的classpath和项目结构
问题2:字符转换以及键盘按键设置 操作:键盘快捷方式[ctrl+k ctrl+s] , 输入大小写按键并进行测试;
WeiyiGeek.VSCODE
问题3.设置windows/linux终端
"terminal.integrated.shell.windows": "C:\\WINDOWS\\System32\\cmd.exe",
"terminal.integrated.shell.linux": "D:\\Program Files\\Git\\git-bash.exe",
"terminal.integrated.shell.windows": "C:\\Program Files\\Git\\bin\\bash.exe"
问题4.设置MD粘贴图片设置
"pasteImage.defaultName": "YMMDDHHmmss",
"pasteImage.basePath": "C:\\Users\\Administrator\\Desktop\\fsdownload",
"pasteImage.path": "C:\\Users\\Administrator\\Desktop\\fsdownload",
"pasteImage.insertPattern": "![WeiyiGeek.](https://cdn.jsdelivr.net/gh/WeiyiGeek/blogimage/2019/${imageFilePath}${imageSyntaxSuffix}",
问题5.vscode字体设置
#控制字体系列。
"editor.fontFamily": "Consolas, 'Courier New', monospace",
#启用字体连字
"editor.fontLigatures": false,
#以像素为单位控制字号。
"editor.fontSize": 14,
#控制字体粗细。
"editor.fontWeight": "normal",
问题6:终端样式修改(即修改User Settings):
"terminal.external.osxExec": "iTerm.app",(适用于mac/os的iTerm)
"terminal.integrated.fontFamily": "Source Code Pro for PowerLine", #特别是zsh主题的时候
问题7:JAVA编译环境 Build failed, do you want to continue?
#清空工作空间
Windows : %APPDATA%\Code\User\workspaceStorage\
MacOS : $HOME/Library/Application Support/Code/User/workspaceStorage/
Linux : $HOME/.config/Code/User/workspaceStorage/
问题8:添加vscode到右键菜单,由于安装时候未进行选择; 描述:下面的vscode是您自己的安装路径
Windows Registry Editor Version 5.00
[HKEY_CLASSES_ROOT\*\shell\VSCode]
@="Open with Code"
"Icon"="D:\\Program Files\\Microsoft VS Code\\Code.exe"
[HKEY_CLASSES_ROOT\*\shell\VSCode\command]
@="\"D:\\Program Files\\Microsoft VS Code\\Code.exe\" \"%1\""
Windows Registry Editor Version 5.00
[HKEY_CLASSES_ROOT\Directory\shell\VSCode]
@="Open with Code"
"Icon"="D:\\Program Files\\Microsoft VS Code\\Code.exe"
[HKEY_CLASSES_ROOT\Directory\shell\VSCode\command]
@="\"D:\\Program Files\\Microsoft VS Code\\Code.exe\" \"%V\""
Windows Registry Editor Version 5.00
[HKEY_CLASSES_ROOT\Directory\Background\shell\VSCode]
@="Open with Code"
"Icon"="D:\\Program Files\\Microsoft VS Code\\Code.exe"
[HKEY_CLASSES_ROOT\Directory\Background\shell\VSCode\command]
@="\"D:\\Program Files\\Microsoft VS Code\\Code.exe\" \"%V\""
问题8.vscode中检测代码中的空白行并去除的方法
#按下ctrl+h键进行正则匹配:
^\s*(?=\r?$)\n
^\d[^.]|(?=\r$) #删除wiz笔记的代码行号(重要)
#保留替换简单正则匹配和替换,并留取关键字(采用了元组的形式)
比如:替换class="abc" 为 class="$style['abc']"
查找正则:class="(.*?)"
替换:class="$style['$1']"
#在比如匹配开头为字母的行在前面加入/
查找正则:(^[a-z])
替换:/$1
# /wp-config.swp
# /wp-config.txt
2.Pycharm 编辑器
pyCharm是一款很好用的编写Python工程的IDE,pycharm 是 Jetbrains 家族中的一个明星产品,
Jetbrains 家族和 Pycharm 版本划分:
- 第一个版本是「Professional(专业版本)」,这个版本功能更加强大,主要是为 Python 和 web 开发者而准备,是需要付费的。
- 第二个版本是「社区版」,一个专业版的阉割版,比较轻量级,主要是为 Python 和数据专家而准备的。
Jetbrains开发了许多好用的编辑器:
- Java 编辑器(IntelliJ IDEA)
- JavaScript 编辑器(WebStorm)
- PHP 编辑器(PHPStorm)
- Ruby 编辑器(RubyMine)
- C 和 C++ 编辑器(CLion)
- .Net 编辑器(Rider)
- iOS/macOS 编辑器(AppCode)等等
官网下载:https://www.jetbrains.com/ 激活网站:http://idea.lanyus.com/
2.1 安装与设置
Step1.安装步骤这里就不说了下一步就行,我这里的版本是;
PyCharm 2019.1.3 (Professional Edition)
Build #PY-191.7479.30, built on May 29, 2019
Licensed to jetbrains js
Subscription is active until November 27, 2019
JRE: 11.0.2+9-b159.60 amd64
JVM: OpenJDK 64-Bit Server VM by JetBrains s.r.o
Windows 10 10.0
Step2.激活前清除hosts中屏蔽域名,激活后请将下面添加到hosts文件中;
0.0.0.0 account.jetbrains.com
0.0.0.0 www.jetbrains.com
WeiyiGeek.IntelliJ IDEA 注册码
Step3.功能更换和设置 Python 解释器,在File->Setting->Projec: xxx
下找到 Project Interpreter
WeiyiGeek.Pycharm的python模块设置
Step4.调整字体大小 setting->Editor>General>font
,调整控制台的字体及其大小setting->Editor>General>colorScheme>Console font
‘
设置文件编码 setting->Editor>General>file encodings
WeiyiGeek.file encodings
Step5.让一个 tab 键代替 4 个空格键
2.2 快捷键
熟悉每个编辑器的快捷键,能大大提高你的工作效率。 常用:
setting : Ctrl+alt+s
WeiyiGeek.快捷键1
WeiyiGeek.快捷键2
WeiyiGeek.Pycharm 快捷键图
2.3 问题配置
(1)Pycharm在创建py文件时,如何自动添加默认文件头注释?
用PyCharm创建一个Python文件或者向工程添加一个.py文件时,为了更好的使所编写的代码在各操作环境更好的运行,我们往往需要在.py文件中添加头文件标注相关信息。
打开PyCharm程序,根据菜单栏中按照如下进入设置:File -> settings -> Editor -> File and Code Templates -> Python Script
,找到Python Script选项,然后将一下内容添加进文本框即可:
#!/usr/bin/env python
# -*- coding: utf-8 -*-
# @File : ${NAME}.py
# @CreateTime : ${DATE} ${TIME}
# @Author : WeiyiGeek
# @Function :
# @Software: ${PRODUCT_NAME}
建立Python file文件将会自动生成文件注释头:
WeiyiGeek.文件注释
(2)Pycharm下载设置文件主题 pycharm主题风格。其设置如下:
- 主题:File -> Settings -> Plugins,搜索:Material Theme UI 并安装。
- 字体:File -> Settings -> Editor -> Font, Font: Source Code Pro,Size: 16, line-spacing: 1.0,apply,保存。
- 字体颜色:File -> Settings -> Editor -> Color Scheme Font -> General, scheme选择github,apply,保存。
WeiyiGeek.rainglow
(3)pycharm中连接数据库sqlite 菜单中的 view > tool windows 选项 > 下拉下一级菜单选中为 database > 选择具体的数据库
WeiyiGeek.pycharm下载sqlite驱动
WeiyiGeek.选择SQLITE数据库并查看
3.IDEA 编辑器
描述:ideaUI是一款很好用的编写JAVA工程的IDE,可以说是既Eclipse之后的最好用的IDE没有之一
Jetbrains 家族和 idea 版本划分:
- 第一个版本是「Ultimate(专业版本)ideaUI」,用于Web和企业开发,需要付费;
- 第二个版本是「社区版」,一个专业版的阉割版,
Download IntelliJ IDEA: http://www.jetbrains.com/idea/download/#section=windows idea激活:http://idea.lanyus.com/
3.1 安装与配置
JAVA 开发环境配置 Step1.点击File –>Project Structure (Ctrl+Alt+Shift+S) Step2.点击左侧标签页SDKs选项,再点击左上角“+”,选择JDK路径
WeiyiGeek.
Step3.点击确定完成即可
3.2 入坑体验
Intellj IDEA光标为insert状态,无法删除内容 描述:发现打开java文件的光标是win系统下按了insert键后的那种宽的光标,并且还无法删除内容,且按删除(delete)键也只见光标往前移动,但内容却没有被删除, 原因:发现是插件plugins的问题 ideaVIM 插件的作用;
WeiyiGeek.isnert光标问题
找不到或无法加载主类 abstractDemo1
答:idea本身缓存问题,解决:清理缓存重启IDEA file-->invalidate Cache/restart
之后再重新build。
3.3 常规配置
1.代码快捷键补全代码的设置 设置路径: File | Settings | Editor | Live Templates 设置流程: 添加Template Group组与LiveTemplate 比如设置 syso
WeiyiGeek.
2.快捷键的设置 设置路径:File | Settings | Keymap 比如代码补全:ALT+/
WeiyiGeek.
3.4 插件推荐
Easycode
是idea的一个插件,可以直接对数据库中的表(指定字段)生成 entity,controller,service,dao,mapper 无需任何编码简单而强大;\
#启动时在dao层加上@mapper注解,并且在在启动类里面加上@MapperScan("com.vue.demo.dao")注解。
#<!--阿里巴巴连接池 SpingBoot pom.xml-->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.0.9</version>
</dependency>
WeiyiGeek.
Lombok
是idea的一个插件,通过注解的方式在编译时自动为属性生成构造器、getter/setter、equals、hashcode、toString方法。出现的神奇就是在源码中没有getter和setter方法
,但是在编译生成的字节码文件中有getter和setter方法。
Lombok 的使用跟引用 jar 包一样,可以在官网(https://projectlombok.org/download)下载 jar 包,也可以使用 maven 添加依赖:
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>1.18.10</version>
<scope>provided</scope>
</dependency>
注意事项:
- 1.首次使用 Lombok 插件需要做如下几步配置,将 Lombok 插件安装到 IDEA,选中 Plugins,搜索 Lombok,点击 Install;
- 选择默认的编译方式为 javac,因为 eclipse 是不支持 Lombok 的编译方式的,javac 支持 Lombok 的编译方式。
- 打开注解生成器 Enable annotation processing
- PS:IntelliJ IDEA 2019.2需要手动下载对应版本的插件,然后手动引入,在 IDEA 中选择 File -> Setting -> plugins 找到 Install Plugin from Disk…(注意版本不同位置可能有所差异)
- 选择默认的编译方式为 javac,因为 eclipse 是不支持 Lombok 的编译方式的,javac 支持 Lombok 的编译方式。
相关文章
- 二、编辑器开发之ContextMenu
- 八、编辑器开发之GUILayout布局
- 十一、编辑器开发之Toggle
- Unity 编辑器开发实战【Editor Window】- Animation Clip Previewer 动画片段预览工具
- Unity 编辑器开发实战【MenuItem】- 批量删除场景中的LOD Group,保留最高层次细节
- Unity 编辑器开发实战【Model Importer】- 如何多选设置模型导入设置中的Material Location
- Unity 编辑器开发实战【Editor Window】- Duplicator复制机
- Unity 编辑器开发实战【Editor Window】- Replacer 替换器
- 从0到1开发可视化拖拽H5编辑器(React)
- Visual Studio Code——做嵌入式C/C++开发常用的编辑器软件安装及基本使用总结
- ON1 Photo RAW 2023.1 for Mac(照片编辑器) 17.1.1.13585激活版
- [软件下载] Adobe Acrobat XI Pro v11.0.23(安装即激活) pdf编辑器全版本下载
- 初探富文本之编辑器引擎
- Adobe Acrobat DC2021安装详细教程 pdf编辑器全版本下载
- unity如何在编辑器扩展中使用协程?
- fabric.js开发图片编辑器的细节实现
- 20.8k stars本科生为你开发的十六进制编辑器
- Acrobat 9 Pro -pdf编辑器全版本下载地址
- PHP在线图像编辑器 Pixie v3.0.3
- 欢迎使用CSDN-markdown编辑器详解手机开发
- 快速退出vim编辑器:Linux中的Vim技巧(linuxvim退出)
- Linux终端神器vi编辑器实现强大功能(linux终端vi)
- 编辑器开启Linux之旅:Vi编辑器指南(linux系统下的vi)
- Linux系统高效使用VIM编辑器
- MySQL编辑器推荐:25款适合各种需求的数据库编辑工具(mysql数据库编辑工具)
- Emacs是一款著名的集成开发环境和文本编辑器,被公认为是最受专业程序员喜爱的代码编辑器之一。
- Oracle 32位编辑器改变未来编码开发模式(oracle32位编辑器)
- 使用#default#userdata组件实现的可记忆内容的编辑器