LaravelAssetify is a Visual Studio Code extension that effortlessly converts HTML image, script, and link paths to dynamic Laravel asset paths. Simplify your workflow by transforming static asset references into Laravel's `asset()` helper function format, ensuring compatibility with your Laravel-pow
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
LaravelAssetify is a Visual Studio Code extension that converts HTML image, script, and link paths to Laravel asset paths. This extension helps you easily switch your static asset paths to use Laravel's asset() helper function.
Features
Convert image (<img>), script (<script>), and link (<link>) paths to Laravel asset paths.
Automatically detects paths that are already in Laravel asset format or start with "https://" and skips conversion for those.
Supports converting the selected text or the entire file.
Requirements
This extension requires Visual Studio Code version 1.80.0 or higher.
How to Use
Open a HTML file in Visual Studio Code.
Select the text containing image, script, or link paths that you want to convert.
Right-click on the selected text or use the command palette (Ctrl+Shift+P) and search for "Convert to Laravel Asset Path."
If nothing is selected, the extension will prompt you to convert the entire file.
The extension will convert the paths to use Laravel's asset() function, excluding paths already in the correct format or starting with "https://".
Note
No Path Validation: This extension does not validate the paths provided. It converts the paths to use Laravel's asset() function directly. Ensure that the paths are correct and accessible within your Laravel application.
Quotation Mark Issue: Be cautious when the predefined Laravel asset path and the attribute use the same quotation mark (either single or double). The extension may encounter issues and break them. For example:
<!-- Incorrect (Might get broken by the extension) -->
<img src="{{ asset("images/logo.png") }}">
<img src='{{ asset('images/logo.png') }}'>
<!-- Correct (Will be ignored by the extension) -->
<img src="{{ asset('images/logo.png') }}">
<img src='{{ asset("images/logo.png") }}'>
Recommendation: Use this after you have done your component slicing.
Currently only supports (src) and (href) attributes for (<img>), (<script>), and (<link>) tags.
Some indentation issues might occur with ,
, and tags after conversion.
License
This extension is licensed under the MIT License. See the LICENSE file for details.
Contributing
Contributions are welcome! Feel free to open issues or pull requests on GitHub.
Feedback
If you have any feedback, suggestions, or issues, please let us know by opening an issue on GitHub.