Last active
July 28, 2023 18:28
-
-
Save fzldn/a27973ff7e4c8e3738b0e06e525f7403 to your computer and use it in GitHub Desktop.
VS Code Laravel Blade formatter using extension Beautify 1.5.0 by HookyQR with js-beautify hacks
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
... | |
Beautifier.prototype.beautify = function() { | |
... | |
var source_text = this._source_text; | |
// BEGIN | |
source_text = source_text.replace(/\{\{(--)?((?:(?!(--)?\}\}).)+)(--)?\}\}/g, function(m, ds, c, dh, de) { | |
if (c) { | |
c = c.replace(/(^[ \t]*|[ \t]*$)/g, ''); | |
c = c.replace(/'/g, '''); | |
c = c.replace(/"/g, '"'); | |
c = encodeURIComponent(c); | |
} | |
return "{{" + (ds ? ds : "") + c + (de ? de : "") + "}}"; | |
}); | |
source_text = source_text.replace(/^[ \t]*@([a-z]+)([^\n]*)$/gim, function(m, d, c) { | |
if (c) { | |
c = c.replace(/'/g, '''); | |
c = c.replace(/"/g, '"'); | |
c = "|" + encodeURIComponent(c); | |
} | |
switch (d) { | |
case 'break': | |
case 'case': | |
case 'continue': | |
case 'default': | |
case 'empty': | |
case 'endsection': | |
case 'else': | |
case 'elseif': | |
case 'extends': | |
case 'csrf': | |
case 'include': | |
case 'json': | |
case 'method': | |
case 'parent': | |
case 'section': | |
case 'stack': | |
case 'yield': | |
return "<blade " + d + c + "/>"; | |
default: | |
if (d.startsWith('end')) { | |
return "</blade " + d + c + ">"; | |
} else { | |
return "<blade " + d + c + ">"; | |
} | |
} | |
}); | |
// END | |
... | |
var sweet_code = printer._output.get_code(eol); | |
// BEGIN | |
sweet_code = sweet_code.replace(/^([ \t]*)<\/?blade ([a-z]+)\|?([^>\/]+)?\/?>$/gim, function toDirective(m, s, d, c) { | |
if (c) { | |
c = decodeURIComponent(c); | |
c = c.replace(/'/g, "'"); | |
c = c.replace(/"/g, '"'); | |
c = c.replace(/^[ \t]*/g, ''); | |
} else { | |
c = ""; | |
} | |
if (!s) { | |
s = ""; | |
} | |
switch (d) { | |
case 'else': | |
case 'elseif': | |
case 'empty': | |
s = s.replace(printer._output.__indent_cache.__indent_string, ''); | |
break; | |
} | |
return s + "@" + d + c.trim(); | |
}); | |
sweet_code = sweet_code.replace(/@(case|default)((?:(?!@break).|\n)+)@break/gim, function addMoreIndent(m, t, c) { | |
var indent = printer._output.__indent_cache.__base_string; | |
c = c.replace(/\n/g, "\n" + indent + printer._output.__indent_cache.__indent_string); | |
c = c.replace(new RegExp(indent + '@' + t, 'gi'), '@' + t); | |
return "@" + t + c + "@break"; | |
}); | |
sweet_code = sweet_code.replace(/\{\{(--)?((?:(?!(--)?\}\}).)+)(--)?\}\}/g, function (m, ds, c, dh, de) { | |
if (c) { | |
c = decodeURIComponent(c); | |
c = c.replace(/'/g, "'"); | |
c = c.replace(/"/g, '"'); | |
c = c.replace(/(^[ \t]*|[ \t]*$)/g, ' '); | |
} | |
return "{{" + (ds ? ds : "") + c + (de ? de : "") + "}}"; | |
}); | |
// END | |
return sweet_code; | |
}; | |
... |
I just solved it and you can watch how here https://gist.github.com/maliouris/f84b7f3dcb2a71455e693716e76ce302
I worked on a different solution.
I forked js-beautify and published a new package to format Blade files as HTML
you can find it from here: https://github.com/ThePlanet-Tech/js-beautify
I still need more contributors & testers to make sure everything is smooth and working fine.
you can install the package by npm install js-beautify-with-blade
then use it html-beautify -r resources/views/**/*.blade.php
you can also configure all the rules you want on .jsbeautifyrc
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I still get the error <blade section|(%26%2339%3Btitle%26%2339%3B%2C%20%26%2339%3BEdit%20details%20for%20%26%2339%3B%20.%20%24customer-%3Ename) /> when an if statement exceeds a line length and I dont think "html.format.wrapLineLength": 0 cause all in one line isn't a proper formating, is the solution. Has anyone come up with anything else ?