feature_request(html): backend CoffeeScript compilation inside HTML files

[Kristinita]

1. Summary

It would be nice to have an option that would compile CoffeeScript to JavaScript inside HTML files during the backend process.

2. Example of expected behavior

The user runs a command like this:

coffee --compile-inside-html=true -c KiraCoffeeScript.html

If the file KiraCoffeeScript.html contains <script type="text/coffeescript"><script>, the content inside this tag will be compiled from CoffeeScript to JavaScript.

For example, if the file KiraCoffeeScript.html contains:

<script type="text/coffeescript">
    Defer.css "../theme/css/components/footer.css", "footer", 700
</script>

After running the command above, CoffeeScript will replace it with:

<script>
    Defer.css("../theme/css/components/footer.css", "footer", 700);
</script>

3. Argumentation

I want to always write in CoffeeScript, not JavaScript, because in my opinion, CoffeeScript is much more convenient to use. But I don’t know how I can do this if I have to write code inside .html files, and not in separate .coffee files. I didn’t find the solution I needed in the CoffeeScript documentation, on Google and in this issue tracker. Currently, I need to add JavaScript, not CoffeeScript code to HTML files.

4. Replies to possible reasons for closing the issue

4.1. “Just use CoffeeScript browser compiler”

Loading the 77Kb script compiler coffescript.js and compilation CoffeeScript to JavaScript in the browser is a bad solution for web performance. The official CoffeeScript documentation states that “it’s not recommended for serious use”.

This isn’t what I’m asking. When I wrote about “backend compilation” in the title of my issue, I meant that CoffeeScript to JavaScript compilation should be done at website build time. Website visitors must open pages with CoffeeScript already compiled to JavaScript.

4.2. “Just move your code from “.html” to “.coffee” file”

Users of site generators, CMS, web frameworks use template engines, such as Jinja, Mustache, Twig, Pug. For example, I use Pelican website generator, that uses template engine Jinja2. In the original, my code contains templates, for example:

<script>
    Defer.css("{{ SITEURL }}/{{ THEME_STATIC_DIR }}/theme/css/components/footer{{ MIN }}.css", "footer", 700);
</script>

I can’t just move it to .coffee file.

Pelican environment settings don’t allow converting variables inside templates, compile CoffeeScript to JavaScript and insert the compiled JavaScript into the right place of the HTML markup. And I’m not sure this behavior will ever be implemented. If solely it were possible after launching the Pelican build to run CoffeeScript with a command line argument --compile-inside-html=true, that would solve the problem.

Thanks.

[vendethiel]

I can’t just move it to .coffee file.

You can just declare variables upfront in a script tag, and then include your compiled CoffeeScript file. It's a better mix than trying to compile CoffeeScript in a file this way, because you'll end up trying contraptions which won't work, such as data = {{ JSON_DATA }}. Even if a processor existed to do that, you'd need to stack it atop the other transformations done by your framework of choice, your CMS, web framework etc. That sounds like a bad idea as well (in Rails, you'd get something like foo.html.coffee2js.erb or whatever the extension would be). And you'd lose a lot of caching opportunities, because the script would have to compile the coffee file every single time the file changes. There are way more downsides than upsides to this approach.

[Kristinita]

Type: Reply 💬

@vendethiel, excuse me, but I don’t understand what you’re writing about.

1. In this issue, I ask for the ability to compile valid CoffeeScript inside the <script type="text/coffeescript"></script> HTML tag to valid JavaScript. See paragraph 2 for an example of the desired behavior.

2. Of course, I’m not asking to implement in CoffeeScript the compilation of variables and other things from site generators/CMS/web frameworks. The CoffeeScript command, of course, should be run solely after valid CoffeeScript sources will be generated by the template engines.

3. I wrote paragraph 4.2 to show, why I’m forced to place my sources inside the <script></script> HTML tag, and not place it in a separate .coffee file.

Is that how you understood my issue?

Thanks.

[GeoffreyBooth]

You can do this today using existing build tools, or it would be straightforward to build it yourself. This is out of scope for this project.