'There seems to be a problem with the automatic sorting of html files in vscode in the window environment

When I use vscode in the window environment and type in the script part of the .html file and save it, the sentences are automatically arranged as I do not want, so I am worried.

enter image description here

  

    <!DOCTYPE html>
    <html>
    
    <body>
        <div id="root"></div>
    </body>
    <script src="https://unpkg.com/[email protected]/umd/react.production.min.js"></script>
    <script src="https://unpkg.com/[email protected]/umd/react-dom.production.min.js"></script>
    <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
    <script type="text/babel">
        const root = document.getElementById("root");
        let counter = 0;
        function countUp() {
            counter = counter + 1;
            render();
        }
        function render() {
            ReactDOM.render(<Container />, root);
        }
        function Container() {
            return (
                <div>
                    <h3>Total Clicks:{counter} </h3>
                    <button onClick={countUp}>Clock me</button>
                </div>
            );
        }
        render();
    </script>
    
    </html>

after saving

enter image description here


    <!DOCTYPE html>
    <html>
    
    <body>
        <div id="root"></div>
    </body>
    <script src="https://unpkg.com/[email protected]/umd/react.production.min.js"></script>
    <script src="https://unpkg.com/[email protected]/umd/react-dom.production.min.js"></script>
    <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
    <script type="text/babel">
        const root = document.getElementById("root"); let counter = 0; function countUp() { counter = counter + 1; render(); } function render() { ReactDOM.render(
        <Container />, root); } function Container() { return (
        <div>
            <h3>Total Clicks:{counter} </h3>
            <button onClick={countUp}>Clock me</button>
        </div>
        ); } render();
    </script>
    
    </html>

I did some searching and tried changing the formmater in the user settings in vscode but it still changed in a way I didn't want it to.

When I typed in js, automatic alignment was good, but when I typed in the script of the html file, the readability of the sentence was reduced Help me:(

html


Solution 1:[1]

do you installed any extension for sorting html files? if yes, then try to uninstall it.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Friska S E Putri

Related Questions