Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/bhushan6/three-shader-reader
🔌 VS code extension for easy reading of three js shaders
https://github.com/bhushan6/three-shader-reader
shaders three-js vscode-extension
Last synced: 4 months ago
JSON representation
🔌 VS code extension for easy reading of three js shaders
- Host: GitHub
- URL: https://github.com/bhushan6/three-shader-reader
- Owner: bhushan6
- Created: 2023-08-28T16:12:04.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-08-28T20:58:19.000Z (over 1 year ago)
- Last Synced: 2024-10-02T08:37:04.298Z (4 months ago)
- Topics: shaders, three-js, vscode-extension
- Language: JavaScript
- Homepage: https://marketplace.visualstudio.com/items?itemName=BhushanWagh.three-shader-reader
- Size: 50.8 KB
- Stars: 16
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# three-shader-reader README
The "three-shader-reader" is a Visual Studio Code extension designed to simplify shader development in Three.js projects. This extension automatically replaces #include <...> directives in your GLSL code with the actual content from the corresponding .glsl.js files.
## Features
- **List Shader Files**: Easily browse shader files located in `node_modules/three/src/renderers/shaders/ShaderLib`.
- **View Shader Content**: Click on a shader file to view its content in the main editor pane.
- **Resolve Includes**: Automatically replaces `#include <...>` directives with the content of the corresponding `.glsl.js` files.
- **Code Folding**: Use code folding regions to expand or collapse the included content.
## Usage
1. Open a Three.js project in Visual Studio Code.
2. Navigate to the "GLSL Include Resolver" panel on the left sidebar.
3. Click on a shader file to view its content, with `#include <...>` directives automatically resolved.
## Installation
1. Open Visual Studio Code
2. Go to Extensions (`Ctrl+Shift+X`)
3. Search for "three-shader-reader"
4. Click "Install"
## Usage
1. Open a Three.js project in Visual Studio Code.
2. Navigate to the "GLSL Include Resolver" panel on the left sidebar.
3. Click on a shader file to view its content, with `#include <...>` directives automatically resolved.
## How to Contribute
If you encounter any issues or have feature requests, please open an issue on the GitHub repository.
## License
This extension is released under the MIT License.
Feel free to copy and paste this into your README.md file, and modify it as needed to better suit your extension.