この記事の最終更新日: 2023年4月22日
![20 Best Extensions That Make VSCode Super Specialize In Python](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/pexels-pixabay-80474.jpg?resize=1024%2C685&ssl=1)
In this article, we will discuss Python, which is used for AI, machine learning, and web system development. We will introduce 20 essential plugins for development and plugins that significantly improve work efficiency. If there are plugins you haven’t used yet, they are definitely worth trying. Please install them in your own VSCode and customize it to your liking.
7 extensions for Visual
![7 extensions for Visual](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/pexels-scott-webb-311458.jpg?resize=1024%2C683&ssl=1)
1. indent-rainbow
![indent-rainbow vscode](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-0.29.57.png?resize=612%2C115&ssl=1)
![intdent-rainbow vscode](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88-2020-10-06-22.23.27.png?resize=611%2C538&ssl=1)
- By adding indent-rainbow, indents are color-coded by hierarchy.
- In Python, even a slight misalignment due to extra spaces can cause errors. → With indent-rainbow, indents become visually easier to see, preventing mistakes.
2. Material Icon Theme
![Material Icon Theme vscode 拡張](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-0.28.51.png?resize=636%2C122&ssl=1)
![Material Icon Theme vscode 拡張](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/fileIcons-1-e1603466741746-1024x601.png?resize=638%2C374&ssl=1)
![Material Icon Theme](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/folderIcons-e1603466683270-1024x457.png?resize=641%2C285&ssl=1)
- By adding the Material Icon Theme, the icons of plain files and folders will change.
- VSCode’s default icons are bland and can be difficult to distinguish. → With the Material Icon Theme, files and folders become easier to identify.
3. Better Comments
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-0.52.25.png?resize=643%2C121&ssl=1)
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/0_wWjopu7FVl_aikf3.png?resize=642%2C579&ssl=1)
- By adding Better Comments, you can color-code comments based on importance and type.
- The color can be specified by a symbol or a string immediately after the comment. → With Better Comments, managing and identifying comments becomes easier.
5. Trailing Spaces
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-1.48.03.png?resize=647%2C118&ssl=1)
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-1.45.43.png?resize=647%2C266&ssl=1)
By adding Trailing Spaces, extra spaces at the end of the code are displayed in red, helping to keep the source clean.
6. GitHub Theme
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-1.08.20.png?resize=652%2C121&ssl=1)
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_52879_1c028e08-dbee-0695-50d0-0b44b12f3738.png?resize=651%2C406&ssl=1)
- By adding the GitHub Theme, you can change the overall theme of VSCode.
- This theme uses the popular official GitHub color scheme and has a well-regarded palette. → This theme is recommended along with the Night Owl theme that we’ll introduce next. Use the one you like best.
7. Night owl
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-1.27.40.png?resize=652%2C120&ssl=1)
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-06-22.33.26.png?resize=558%2C389&ssl=1)
- By adding Night Owl, you can change the overall theme of VSCode.
- This theme is designed to be gentle on the eyes, making it a recommended choice for long hours of work without eye strain. → Compare this with the GitHub Theme mentioned above and use the one you prefer.
1 extension for format
![1 extension for format](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/pexels-pixabay-220177.jpg?resize=1024%2C683&ssl=1)
1. Python Indent
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-0.31.24.png?resize=620%2C110&ssl=1)
![画像に alt 属性が指定されていません。ファイル名: demo.gif](https://i0.wp.com/github.com/kbrose/vsc-python-indent/raw/master/static/demo.gif?resize=427%2C405&ssl=1)
![画像に alt 属性が指定されていません。ファイル名: スクリーンショット-2020-10-23-23.24.34.png](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88-2020-10-23-23.24.34.png?resize=426%2C270&ssl=1)
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-23-23.26.20.png?resize=429%2C290&ssl=1)
- By adding Python Indent, the accuracy of Python indents improves significantly.
- For example, when entering arguments separated by commas, it automatically adds clean indents. → With Python Indent, the time spent formatting indents is reduced, increasing work efficiency.
3 extensions for auto fill in
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/pexels-mike-van-schoonderwalt-5505130.jpg?resize=1024%2C683&ssl=1)
1. GitHub Copilot
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2023/04/スクリーンショット-2023-04-22-14.52.27.png?resize=616%2C77&ssl=1)
![github copilot](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2023/04/スクリーンショット-2023-04-22-14.56.03.png?resize=612%2C385&ssl=1)
![github copilot](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2023/04/スクリーンショット-2023-04-22-14.56.15.png?resize=617%2C387&ssl=1)
・By adding GitHub Copilot, it automatically generates code based on the code and comments you’ve written so far.
・It utilizes GPT, and since it is most compatible with Python, it generates incredibly accurate suggestions. → By using GitHub Copilot’s code generation feature, you can increase work efficiency.
There is a free trial available, but it is primarily a paid service. Make sure to check the cancellation method before using it.
2. Python Docstring Generator
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-2.45.41.png?resize=605%2C111&ssl=1)
![Auto Generate Docstrings](https://i0.wp.com/github.com/NilsJPWerner/autoDocstring/raw/master/images/demo.gif?resize=603%2C379&ssl=1)
・By adding Docstring Generator, it automatically creates comment formats for functions and classes. → You can efficiently write high-quality source code with comments for classes and functions.
3. Pylance
![pylance vscode 拡張 プラグイン](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-3.02.00.png?resize=614%2C109&ssl=1)
- Pylance is the latest Python language server, released by Microsoft in the summer of 2020.
- By setting python.analysis.typeCheckingMode to basic or strict in the settings, you can use type checking. → By adding Pylance, type checking and library support are significantly upgraded.
3 extensions for other programming language
![vscode プラグイン](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/software.jpg?resize=1024%2C716&ssl=1)
1. Auto Rename Tag
![vscode プラグイン auto rename tag](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-11.30.44.png?resize=626%2C114&ssl=1)
![Usage vscode auto rename tag 拡張機能](https://i0.wp.com/github.com/formulahendry/vscode-auto-rename-tag/raw/master/images/usage.gif?resize=626%2C407&ssl=1)
- Auto Rename Tag makes it easier to change tags in html, xml, php, and javascript.
- The modification of the opening and closing tags is synchronized, making changes easier. → By adding Auto Rename Tag, you can shorten the work time.
2. Highlight Matching Tag
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-11.40.57.png?resize=630%2C119&ssl=1)
![demo](https://i0.wp.com/images2.imgbox.com/71/2a/zIA1XCzK_o.gif?resize=628%2C363&ssl=1)
- Highlight Matching Tag makes tags visually easier to see.
- When you select a tag, underlines are drawn on the opening and closing tags. → By adding Highlight Matching Tag, you can reduce mistakes and increase work efficiency.
3. Prettier – Code formatter
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-11.46.46.png?resize=635%2C119&ssl=1)
- Prettier automatically formats your source code neatly.
- In the settings, make sure to set it to automatically format your source code every time you save.
Supported languages JavaScript · TypeScript · Flow · JSX · JSON CSS · SCSS · Less HTML · Vue · Angular GraphQL · Markdown · YAML
→ By adding Prettier, you can reduce the time spent formatting code yourself and improve code quality.
5 core extensions
1. Python
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-12.04.52.png?resize=639%2C119&ssl=1)
You can’t get started without this. → Add this extension and make Python usable in VSCode.
2. Code Runner
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-12.11.32.png?resize=645%2C117&ssl=1)
![Usage](https://i0.wp.com/github.com/formulahendry/vscode-code-runner/raw/master/images/usage.gif?resize=638%2C418&ssl=1)
It is very convenient for debugging, and you no longer need to open a separate console (terminal) window every time. → By adding Code Runner, you can easily perform simple tests and execution checks.
3. Python Test Explorer for Visual Studio Code
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-12.42.03.png?resize=641%2C122&ssl=1)
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/screenshot.png?resize=642%2C286&ssl=1)
- By adding Python Test Explorer, it supports testing with Python test code.
- Test code is code dedicated to unit testing, which allows you to freely set function and class arguments. → By adding Python Test Explorer, you can efficiently conduct tests.
4. Python Preview
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-12.49.44.png?resize=640%2C117&ssl=1)
![Preview](https://i0.wp.com/raw.githubusercontent.com/dongli0x00/python-preview/master/images/previewDemo.gif?resize=827%2C452&ssl=1)
![Setting](https://i0.wp.com/raw.githubusercontent.com/dongli0x00/python-preview/master/images/settingDemo.gif?resize=829%2C453&ssl=1)
- By adding Python Preview, you can easily visually check the contents of variables and arrays.
- You can check quite detailed information in a separate window, making it easier to identify the cause of bugs. → By adding Python Preview, the accuracy of debugging increases significantly.
5. Todo Tree
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/スクリーンショット-2020-10-24-13.02.26.png?resize=652%2C122&ssl=1)
![](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2020/10/screenshot-1-1.png?resize=651%2C286&ssl=1)
All TODO comments are extracted in “TODOS.” → By adding Todo Tree, you can completely prevent any unfinished work.
![ゆるプロ日記](https://i0.wp.com/yurupro.cloud/wp-content/uploads/2023/01/12245_paint.png?resize=100%2C100&ssl=1)
大阪のエンジニアが書いているブログ。
コメント