Riot js using other libraries like jquery with server side rendering

Question

I am trying to use jquery for dom manipulation on mount event of a component like this.

<my-tag>
    <p>hi</p>

    <script>

        this.on('mount',funciton() {
            $('.abc').hide();
        })
    </script>

</my-tag>

This throws an error shown below

TypeError: Cannot read property 'toString' of undefined
at ServerResponse.writeHead (_http_server.js:189:44)

If I replace

$(".abc").hide()

with

console.log("test");

This works perfectly. Any idea why this is happening?

Given below are the version details

Riot version:

riot-cli: 2.3.14 - https://github.com/riot/cli

riot-compiler: 2.3.22 - https://github.com/riot/compiler

Update

This issue happens only if if place it in this.on('mount')

I tried placing it on this.on('all') and it works fine.

score -1 · Answer 1 · answered Mar 19 '16 at 15:26

I don't think all is a valid Riot event. As for using jQuery on the server, I'd avoid this if possible. If you are hiding an element in your component, then you should be using Riot to switch out a CSS class. If this element is outside your component, you should be emitting events into an outer / global observable / pubsub handler. If you must use jQuery you have to make sure your loading jQuery via Node's require, or using other solutions like DomJS or Cheerio.

Riot js using other libraries like jquery with server side rendering

1 Answers1