Go to page with below javascript

Automatic

html
<div id="text"></div>
<script>
    document.getElementById("text").innerHTML = "Text added by JavaScript code";
</script>

html

<div id="text"></div>
<script>
    document.getElementById("text").innerHTML = "Text added by JavaScript code";
</script>

With highlight js

        <div id="text"></div>
        <script>
            document
                .getElementById("text")
                .innerHTML = "Text added by JavaScript code";
        </script>

With fenced code blocks (is the same as nothing (first one above))

<div id="text"></div>
<script>
    document.getElementById("text").innerHTML = "Text added by JavaScript code";
</script>

Trying different higlighting for different languages

Terminal input/output

With bash as language

elm make src/elm/Main.elm --output src/static/bundle.js

I am having trouble with this file name:

    src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
is good, but I expect all of the files in there to use the following module
naming convention:

    +--------------+-------------------------------------------------------------+
    | Module Name  | File Path                                                   |
    +--------------+-------------------------------------------------------------+
    | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
    | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
    | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
    +--------------+-------------------------------------------------------------+

Notice that the names always start with capital letters! Can you make your file
use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find
things in large projects. If you see a module imported, you know where to look
for the corresponding file every time!

npm install html-webpack-plugin --save-dev
npm install mini-css-extract-plugin --save-dev
npm install workbox-webpack-plugin --save-dev
npm install babel-loader --save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

With plaintext

elm make src/elm/Main.elm --output src/static/bundle.js

I am having trouble with this file name:

    src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
is good, but I expect all of the files in there to use the following module
naming convention:

    +--------------+-------------------------------------------------------------+
    | Module Name  | File Path                                                   |
    +--------------+-------------------------------------------------------------+
    | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
    | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
    | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
    +--------------+-------------------------------------------------------------+

Notice that the names always start with capital letters! Can you make your file
use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find
things in large projects. If you see a module imported, you know where to look
for the corresponding file every time!

npm install html-webpack-plugin --save-dev
npm install mini-css-extract-plugin --save-dev
npm install workbox-webpack-plugin --save-dev
npm install babel-loader --save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

With nohighlight

elm make src/elm/Main.elm --output src/static/bundle.js

I am having trouble with this file name:

    src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
is good, but I expect all of the files in there to use the following module
naming convention:

    +--------------+-------------------------------------------------------------+
    | Module Name  | File Path                                                   |
    +--------------+-------------------------------------------------------------+
    | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
    | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
    | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
    +--------------+-------------------------------------------------------------+

Notice that the names always start with capital letters! Can you make your file
use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find
things in large projects. If you see a module imported, you know where to look
for the corresponding file every time!

npm install html-webpack-plugin --save-dev
npm install mini-css-extract-plugin --save-dev
npm install workbox-webpack-plugin --save-dev
npm install babel-loader --save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

With json as language

elm make src/elm/Main.elm --output src/static/bundle.js

I am having trouble with this file name:

    src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
is good, but I expect all of the files in there to use the following module
naming convention:

    +--------------+-------------------------------------------------------------+
    | Module Name  | File Path                                                   |
    +--------------+-------------------------------------------------------------+
    | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
    | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
    | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
    +--------------+-------------------------------------------------------------+

Notice that the names always start with capital letters! Can you make your file
use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find
things in large projects. If you see a module imported, you know where to look
for the corresponding file every time!

npm install html-webpack-plugin --save-dev
npm install mini-css-extract-plugin --save-dev
npm install workbox-webpack-plugin --save-dev
npm install babel-loader --save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

With javascript as language

elm make src/elm/Main.elm --output src/static/bundle.js

I am having trouble with this file name:

    src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
is good, but I expect all of the files in there to use the following module
naming convention:

    +--------------+-------------------------------------------------------------+
    | Module Name  | File Path                                                   |
    +--------------+-------------------------------------------------------------+
    | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
    | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
    | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
    +--------------+-------------------------------------------------------------+

Notice that the names always start with capital letters! Can you make your file
use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find
things in large projects. If you see a module imported, you know where to look
for the corresponding file every time!

npm install html-webpack-plugin --save-dev
npm install mini-css-extract-plugin --save-dev
npm install workbox-webpack-plugin --save-dev
npm install babel-loader --save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

With html as language

elm make src/elm/Main.elm --output src/static/bundle.js

I am having trouble with this file name:

    src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
is good, but I expect all of the files in there to use the following module
naming convention:

    +--------------+-------------------------------------------------------------+
    | Module Name  | File Path                                                   |
    +--------------+-------------------------------------------------------------+
    | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
    | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
    | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
    +--------------+-------------------------------------------------------------+

Notice that the names always start with capital letters! Can you make your file
use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find
things in large projects. If you see a module imported, you know where to look
for the corresponding file every time!

npm install html-webpack-plugin --save-dev
npm install mini-css-extract-plugin --save-dev
npm install workbox-webpack-plugin --save-dev
npm install babel-loader --save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

With css as language

elm make src/elm/Main.elm --output src/static/bundle.js

I am having trouble with this file name:

    src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
is good, but I expect all of the files in there to use the following module
naming convention:

    +--------------+-------------------------------------------------------------+
    | Module Name  | File Path                                                   |
    +--------------+-------------------------------------------------------------+
    | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
    | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
    | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
    +--------------+-------------------------------------------------------------+

Notice that the names always start with capital letters! Can you make your file
use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find
things in large projects. If you see a module imported, you know where to look
for the corresponding file every time!

npm install html-webpack-plugin --save-dev
npm install mini-css-extract-plugin --save-dev
npm install workbox-webpack-plugin --save-dev
npm install babel-loader --save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

With markdown as language

elm make src/elm/Main.elm --output src/static/bundle.js

I am having trouble with this file name:

    src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
is good, but I expect all of the files in there to use the following module
naming convention:

    +--------------+-------------------------------------------------------------+
    | Module Name  | File Path                                                   |
    +--------------+-------------------------------------------------------------+
    | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
    | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
    | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
    +--------------+-------------------------------------------------------------+

Notice that the names always start with capital letters! Can you make your file
use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find
things in large projects. If you see a module imported, you know where to look
for the corresponding file every time!

npm install html-webpack-plugin --save-dev
npm install mini-css-extract-plugin --save-dev
npm install workbox-webpack-plugin --save-dev
npm install babel-loader --save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

Codeblock

elm make src/elm/Main.elm --output src/static/bundle.js

I am having trouble with this file name:

    src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
is good, but I expect all of the files in there to use the following module
naming convention:

    +--------------+-------------------------------------------------------------+
    | Module Name  | File Path                                                   |
    +--------------+-------------------------------------------------------------+
    | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
    | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
    | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
    +--------------+-------------------------------------------------------------+

Notice that the names always start with capital letters! Can you make your file
use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find
things in large projects. If you see a module imported, you know where to look
for the corresponding file every time!

npm install html-webpack-plugin --save-dev
npm install mini-css-extract-plugin --save-dev
npm install workbox-webpack-plugin --save-dev
npm install babel-loader --save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

Fenced Codeblock

    elm make src/elm/Main.elm --output src/static/bundle.js

    I am having trouble with this file name:
                                                                                        
        src/elm/Main.elm
                                                                                        
    I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which      
    is good, but I expect all of the files in there to use the following module         
    naming convention:                                                                  
                                                                                        
        +--------------+-------------------------------------------------------------+
        | Module Name  | File Path                                                   |
        +--------------+-------------------------------------------------------------+
        | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
        | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
        | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
        +--------------+-------------------------------------------------------------+
                                                                                        
    Notice that the names always start with capital letters! Can you make your file     
    use this naming convention?                                                         
                                                                                        
    Note: Having a strict naming convention like this makes it a lot easier to find     
    things in large projects. If you see a module imported, you know where to look      
    for the corresponding file every time!                                              
                                                                                        
    npm install html-webpack-plugin --save-dev                                          
    npm install mini-css-extract-plugin --save-dev                                      
    npm install workbox-webpack-plugin --save-dev                                       
    npm install babel-loader --save-dev                                                 
                                                                                        
    [webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

Html figure (too make it look like highlight)


    elm make src/elm/Main.elm --output src/static/bundle.js

    I am having trouble with this file name:

        src/elm/Main.elm

    I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
    is good, but I expect all of the files in there to use the following module
    naming convention:

        +--------------+-------------------------------------------------------------+
        | Module Name  | File Path                                                   |
        +--------------+-------------------------------------------------------------+
        | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
        | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
        | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
        +--------------+-------------------------------------------------------------+

    Notice that the names always start with capital letters! Can you make your file
    use this naming convention?

    Note: Having a strict naming convention like this makes it a lot easier to find
    things in large projects. If you see a module imported, you know where to look
    for the corresponding file every time!

    npm install html-webpack-plugin --save-dev
    npm install mini-css-extract-plugin --save-dev
    npm install workbox-webpack-plugin --save-dev
    npm install babel-loader --save-dev

    [webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

Html figure with black background


    elm make src/elm/Main.elm --output src/static/bundle.js

    I am having trouble with this file name:

        src/elm/Main.elm

    I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which
    is good, but I expect all of the files in there to use the following module
    naming convention:

        +--------------+-------------------------------------------------------------+
        | Module Name  | File Path                                                   |
        +--------------+-------------------------------------------------------------+
        | Main         | /home/andre/git/repo/starting-with-elm/src/Main.elm         |
        | HomePage     | /home/andre/git/repo/starting-with-elm/src/HomePage.elm     |
        | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm |
        +--------------+-------------------------------------------------------------+

    Notice that the names always start with capital letters! Can you make your file
    use this naming convention?

    Note: Having a strict naming convention like this makes it a lot easier to find
    things in large projects. If you see a module imported, you know where to look
    for the corresponding file every time!

    npm install html-webpack-plugin --save-dev
    npm install mini-css-extract-plugin --save-dev
    npm install workbox-webpack-plugin --save-dev
    npm install babel-loader --save-dev

    [webpack-cli] Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)

As blockquote

elm make src/elm/Main.elm –output src/static/bundle.js

I am having trouble with this file name:

src/elm/Main.elm

I found it in your /home/andre/git/repo/starting-with-elm/src/ directory which is good, but I expect all of the files in there to use the following module naming convention:

+————–+————————————————————-+ | Module Name | File Path | +————–+————————————————————-+ | Main | /home/andre/git/repo/starting-with-elm/src/Main.elm | | HomePage | /home/andre/git/repo/starting-with-elm/src/HomePage.elm | | Http.Helpers | /home/andre/git/repo/starting-with-elm/src/Http/Helpers.elm | +————–+————————————————————-+

Notice that the names always start with capital letters! Can you make your file use this naming convention?

Note: Having a strict naming convention like this makes it a lot easier to find things in large projects. If you see a module imported, you know where to look for the corresponding file every time!

npm install html-webpack-plugin –save-dev npm install mini-css-extract-plugin –save-dev npm install workbox-webpack-plugin –save-dev npm install babel-loader –save-dev

[webpack-cli] Error: Compiling RuleSet failed: Query arguments on ‘loader’ has been removed in favor of the ‘options’ >property (at ruleSet[1].rules[3].loader: elm-webpack?verbose=true&warn=true)