简体   繁体   中英

Riot.js Tags are Not Found

I am at a loss on this one. I have used Riot in the past (albeit several months ago). As far as I can tell, I am following the same process I did in the past, as well as even trying to copy verbatim from the Riot.js examples and continuously do not see my tags rendering and receive this error

"Uncaught Error: "/Tags/sample.tag" not found at Function.Sr.error (riot%2Bcompiler.min.js:2) at XMLHttpRequest.Er.n.onreadystatechange (riot%2Bcompiler.min.js:2)"

What I have is incredibly simple (just trying to figure out what I am missing). Here is my tag file:

<sample>
    <h3>{ message }</h3>
    <ul>
        <li each={ techs }>{ name }</li>
    </ul>
    <script>
    this.message = 'Hello, Riot!'
    this.techs = [
      { name: 'HTML' },
      { name: 'JavaScript' },
      { name: 'CSS' }
    ]
    </script>
    <style>

        :scope {
            font-size: 2rem
        }

        h3 {
            color: #444
        }

        ul {
            color: #999
        }
    </style>
</sample>

And here is the page I want to render it on:

@{
    ViewBag.Title = "Home Page";
}

<head>
    <title>Riot</title>
    <script src="https://rawgit.com/riot/riot/master/riot%2Bcompiler.min.js"></script>
</head>

<body>

    <h1>Riot Tags</h1>

    <sample></sample>

    <script type="riot/tag" src="~/Tags/sample.tag">
    </script>

    <script>riot.mount('sample')</script>

</body>

This is just one example. At this point I have tried numerous tags and page renderings. Thanks for the help.

*Note: This is an MVC project

One issue is if your going to access the riot library/compiler through a link address, then you need to place the script in the body not in the head

also i'm not sure the use case for the "~" in the file path to your tag. So i omitted it and it rendered for me. Hope this helps.

<!DOCTYPE html>
<html>

<head>
    <title>Riot</title>
</head>

<body>

    <h1>Riot Tags</h1>
    <script src="https://rawgit.com/riot/riot/master/riot%2Bcompiler.min.js"></script>

    <sample></sample>


    <script type="riot/tag" src="/tags/sample.tag"></script>

    <script>riot.mount('sample')</script>

</body>

</html>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM