开发常用IDE编辑器进阶配置使用

2019-03-08
Editor

开发常用IDE编辑器进阶配置使用

2019-03-08

[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
智能提示: 借助 IntelliSense 超越语法突出显示和自动完成功能，它提供基于变量类型、函数定义和导入模块的智能补全功能。
支持各种文件格式（html/jade/css/less/sass/xml）
调试功能强大，启动或附加到正在运行的应用，并使用断点、调用堆栈和交互式控制台进行调试
各种方便的快捷键
可扩展和可定制，市场应用上有众多强大的插件，实现编辑器功能增强。
跨平台，其支持Windows、Linux、以及苹果 MacOS 系统上运行。

官网　：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常用插件：

点击阅读完整原文

[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
智能提示: 借助 IntelliSense 超越语法突出显示和自动完成功能，它提供基于变量类型、函数定义和导入模块的智能补全功能。
支持各种文件格式（html/jade/css/less/sass/xml）
调试功能强大，启动或附加到正在运行的应用，并使用断点、调用堆栈和交互式控制台进行调试
各种方便的快捷键
可扩展和可定制，市场应用上有众多强大的插件，实现编辑器功能增强。
跨平台，其支持Windows、Linux、以及苹果 MacOS 系统上运行。

官网　：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

#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] , 输入大小写按键并进行测试;

问题3.设置windows/linux终端

1
2
3

"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.top-](https://img.weiyigeek.top/2019/${imageFilePath}${imageSyntaxSuffix}",

问题5.vscode字体设置

#控制字体系列。
"editor.fontFamily": "Consolas, 'Courier New', monospace",
#启用字体连字
"editor.fontLigatures": false,
#以像素为单位控制字号。
"editor.fontSize": 14,
#控制字体粗细。
"editor.fontWeight": "normal",

问题6：终端样式修改(即修改User Settings):

1 2	"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文件中;

1 2	0.0.0.0 account.jetbrains.com 0.0.0.0 www.jetbrains.com

Step3.功能更换和设置 Python 解释器，在File->Setting->Projec: xxx下找到 Project Interpreter

Step4.调整字体大小 setting->Editor>General>font,调整控制台的字体及其大小setting->Editor>General>colorScheme>Console font‘
设置文件编码 setting->Editor>General>file encodings

Step5.让一个 tab 键代替 4 个空格键

2.2 快捷键

熟悉每个编辑器的快捷键，能大大提高你的工作效率。
常用：

1	setting : Ctrl+alt+s

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文件将会自动生成文件注释头：

(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，保存。

(3)pycharm中连接数据库sqlite
菜单中的 view > tool windows 选项 > 下拉下一级菜单选中为 database > 选择具体的数据库

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路径

Step3.点击确定完成即可

3.2 入坑体验

Intellj IDEA光标为insert状态，无法删除内容
描述：发现打开java文件的光标是win系统下按了insert键后的那种宽的光标，并且还无法删除内容，且按删除(delete)键也只见光标往前移动，但内容却没有被删除，
原因：发现是插件plugins的问题 ideaVIM 插件的作用;

找不到或无法加载主类 abstractDemo1
答:idea本身缓存问题,解决：清理缓存重启IDEA file-->invalidate Cache/restart 之后再重新build。

3.3 常规配置

1.代码快捷键补全代码的设置
设置路径: File | Settings | Editor | Live Templates
设置流程: 添加Template Group组与LiveTemplate 比如设置 syso

2.快捷键的设置
设置路径:File | Settings | Keymap
比如代码补全:ALT+/

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>

Lombok 是idea的一个插件，通过注解的方式在编译时自动为属性生成构造器、getter/setter、equals、hashcode、toString方法。出现的神奇就是在源码中没有getter和setter方法，但是在编译生成的字节码文件中有getter和setter方法。
Lombok 的使用跟引用 jar 包一样，可以在官网（https://projectlombok.org/download）下载 jar 包，也可以使用 maven 添加依赖：
1
2
3
4
5
6
<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…（注意版本不同位置可能有所差异）

欢迎各位志同道合的朋友一起学习交流，如文章有误请在下方留下您宝贵的经验知识，个人邮箱地址【master#weiyigeek.top】或者个人公众号【WeiyiGeek】联系我。

更多文章来源于【WeiyiGeek Blog - 为了能到远方，脚下的每一步都不能少】, 个人首页地址( https://weiyigeek.top )

专栏书写不易，如果您觉得这个专栏还不错的，请给这篇专栏 【点个赞、投个币、收个藏、关个注、转个发、赞个助】，这将对我的肯定，我将持续整理发布更多优质原创文章！。

最后更新时间：2023-06-06 17:20:29
文章原始路径：_posts/编程世界/开发必备/开发工具/开发常用IDE编辑器进阶配置使用.md
转载注明出处，原文地址：https://blog.weiyigeek.top/2019/3-8-375.html
本站文章内容遵循知识共享署名 - 非商业性 - 相同方式共享 4.0 国际协议

WeiyiGeeker