2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效

大家好,今天为大家带来的事2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效。感兴趣的可以收藏点赞哦。

文章目录

    • 1 简介
    • 2 安装步骤
    • 3 提高效率的 10 个方法
        • 1、webstorm开启es6环境
        • 2、新建vue文件的模板设置
        • 3、webstorm设置代码自动换行
        • 4、webstorm开启代码提示
        • 5、面板展示与增加面板展示项
        • 6、全局搜索(shift键双击,搜索包括文件,变量,函数等等)
        • 7、设置主题样式、字体大小、字体样式、行高(Ctrl + Alt + S)
        • 8、文件修改的历史版本对比
        • 9、开启代码补全
        • 10、多光标选择
    • 4 常用快捷键

1 简介

WebStorm 是JetBrains公司旗下一款JavaScript 开发工具。已经被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。与IntelliJ IDEA同源,继承了IntelliJ IDEA强大的JS部分的功能。

2 安装步骤

WebStorm 的安装其实很简单,大概可以分为 8 步。

1、如果之前装有WebStorm版本, 可以先删卸载, 再重新安装

2、到官网下载WebStorm安装包
https://www.jetbrains.com/zh-cn/webstorm/download/other.html
推荐使用2021.2.2版本, 亲测有效
图片[1] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

3、双击打开exe程序,点击“Next”
图片[2] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

4、选择安装位置,点击“Next”
图片[3] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

5、全选所有选项,点击“Next”
图片[4] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

6、确认安装界面,点击“Next”
图片[5] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

7、等待安装
图片[6] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

8、安装完成,选择何时启动,点击“Finish”
图片[7] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

  1. 如果想了解怎样授权的话,可以看这篇教程,里面有详细介绍 WebStorm 授权教程 https://it1314.top/article/778/

3 提高效率的 10 个方法

1、webstorm开启es6环境

图片[8] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

2、新建vue文件的模板设置

图片[9] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

3、webstorm设置代码自动换行

图片[10] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

4、webstorm开启代码提示

图片[11] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

图片[12] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

5、面板展示与增加面板展示项

图片[13] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

6、全局搜索(shift键双击,搜索包括文件,变量,函数等等)

图片[14] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

7、设置主题样式、字体大小、字体样式、行高(Ctrl + Alt + S)

图片[15] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

8、文件修改的历史版本对比

图片[16] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

图片[17] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

9、开启代码补全

(参考网址:https://jingyan.baidu.com/article/a3f121e4a64767fc9152bb40.html)

图片[18] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

10、多光标选择

修改目的:将上述代码的class属性修改item = > item1;修改方法:按住 Alt 键,鼠标便变成了同一位置向下选择。

图片[19] - 2023年 WebStorm 下载、安装教程、附详细图文教程,亲测有效 - MaxSSL

对于同一位置的,我们可以使用上述方法,对于不同位置的item => item1,我们可以选择一个,然后 _ 按住 Alt 键_
,在选择第2个、第3个、第4个…第n个即可,实现统一修改。

4 常用快捷键

快捷键说明
Ctrl+/ 或 Ctrl+Shift+/注释(// 或者/…/ )
Shift+F6重命名
Ctrl+X删除行保存到剪切板
Ctrl+Y删除一行
Shift+Enter重新开始下一行(无论光标在哪个位置)
Ctrl + Shift + Enter重新开始上一行(无论光标在哪个位置)
Ctrl+D复制行
Ctrl+G查找行
Ctrl+Shift+Up/Down代码向上/下移动。
F2 或 Shift+F2高亮错误或警告快速定位
Ctrl+Shift+F7高亮显示选中文本,按Esc高亮消失
Ctrl+B 或 Ctrl+鼠标左键快速打开光标处的类或方法
Ctrl + Alt + B跳转方法实现处
Ctrl + Shift + I打开定义快速查找
Alt + Up/Down跳转到上一个/下一个方法
Ctrl+E最近打开的文件
Alt+F1查找代码所在位置
Ctrl+Alt+L格式化代码
Ctrl+R替换文本
Ctrl+Shift+R指定目录内代码批量替换
Ctrl+Shift+F指定目录内代码批量查找
Ctrl+F查找文本
Ctrl+P方法参数提示
F3查找下一个
Shift+F3查找上一个
Alt+Shift+F将当前文件加入收藏夹
Ctrl+Alt+S打开配置窗口
Ctrl+Shift+N通过文件名快速查找工程内的文件(必记)
Ctrl+Shift+Alt+N通过一个字符快速查找位置(必记)
Shift+Enter重新开始一行(无论光标在哪个位置)
Ctrl + Alt + T用 if, else, try, catch, for 等来围绕选中的代码块
Ctrl + Shift + U切换光标所在位置单词的大小写
Ctrl + Delete删除到单词结束
Ctrl + Backspace删除到单词开始
Ctrl + E弹出最近打开的文件
F11切换书签,就是 sublime text 的F2
Ctrl + Shift + F12切换最大化编辑器
Alt + Shift + F添加至收藏夹
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享