Riot.js 未找到编译器/404 标记

Riot.js compiler / 404 tag not found

我正在尝试将 riot.js 标记包含到我的项目中,以便我可以重用组件。该应用程序在 Node+Express 上运行并使用 Pug 进行模板化。

我有一个呈现以下页面的路由:

include includes/header.pug
link(rel="stylesheet" href="/styles/kaljasakot.css" type="text/css")
body(id='bootstrap-override')
    div(class='container-fluid')
        div(class='header')
            img(class='okklogo' src='img/okkimg.jpeg' height='80' width='130')
            h1 Kaljasakot
    kaljasakot
    script(type="riot/tag" src="kaljasakot.tag")
    script(src="https://cdn.jsdelivr.net/riot/2.6/riot+compiler.min.js")
    script riot.mount('kaljasakot')
    include includes/footer.pug
    script(src='/js/kaljasakot.js') 

即我正在尝试在 Pug 模板中安装 riot 标签 kaljasakot。但是,浏览器在页面呈现时在控制台中给出了 404 错误:

GET http://localhost:3001/kaljasakot.tag 404 (Not Found) riot+compiler.min.js:2

我对标记文件应该放在何处以便编译器找到它有点困惑,而且我无法从 Google 中找到任何关于此的提示。有人遇到过这种情况吗?

如果需要,可以在此处找到整个项目 Github link

标签文件不是在编译 Pug 模板时获取的,而是在应用 运行 时从浏览器获取的。 目前您还没有告诉 Express 在哪里可以找到标签文件。

要解决此问题,您可以创建一个文件夹 public/tags,将标签文件移到其中并像 script(type="riot/tag" src="tags/kaljasakot.tag") 一样使用它们。 Express 将从那里找到文件,因为您已将 public 文件夹配置为静态文件的来源。

现在请求不会再返回 404,但标记文件也不会正常工作。 由于您在标记文件中使用 Pug,因此您需要在应用程序使用它们之前对它们进行预编译。如果你只是按照上面的建议将 kaljasakot.tag 放到 public 文件夹,你会看到一个错误 Uncaught SyntaxError: Unexpected token = 因为 Riot 不理解 Pug 语法。

因此,您可能只想将标签文件保留在 views 文件夹中,并设置构建步骤,在该步骤中编译标签并将它们移至 public/tags 文件夹。例如,参见 Riot's documentation on server compilation and gulp-riot