节点 ejs 动态 javascript 加载

Question

所以我试图让路由文件传递需要包含在页面中的 javascript 文件列表，并让 ejs 构建 header 以包含这些脚本

我的路线文件

router.get('/:name', function(req,res, next) {
  res.render('templates/experiment', {
    name:req.params.name,
    extraScripts:experiments[req.params.name].extraScripts
  })
});

我的experiment.ejs

<head>
  <title><%= name %></title>
  <script src="../javascripts/p5/p5.js"></script>
  <script src="../javascripts/p5/addons/p5.dom.js"></script>
  <script src="../javascripts/p5/addons/p5.sound.js"></script>
  <% for(var i = 0; i < extraScripts.length; i++) { %>
    <script scr=<%= "../javascripts/" + extraScripts[i]%> ></script>
  <% }%>
  <script src=<%= "../javascripts/experiments/"+name + "/sketch.js"%>></script>
  <style> body {padding: 0; margin: 0;} </style>
</head>

现在，当我加载页面时，我可以看到脚本标签很好，但它并没有真正加载额外的脚本。

<head>
  <title>snake</title>
  <script src="../javascripts/p5/p5.js"></script>
  <script src="../javascripts/p5/addons/p5.dom.js"></script>
  <script src="../javascripts/p5/addons/p5.sound.js"></script>

  <script scr=../javascripts/library/colors.js ></script>

  <script src=../javascripts/experiments/snake/sketch.js></script>
  <style> body {padding: 0; margin: 0;} </style>
</head>

colors.js 文件没有加载我是不是遗漏了什么，sketch.js 是动态的，它加载得很好。

Answer 1

您的代码中有错字使用 src 代替 scr.

也尝试将 src 路径括在双引号内，如下所示

<head>
  <title><%= name %></title>
  <script src="../javascripts/p5/p5.js"></script>
  <script src="../javascripts/p5/addons/p5.dom.js"></script>
  <script src="../javascripts/p5/addons/p5.sound.js"></script>
  <% for(var i = 0; i < extraScripts.length; i++) { %>
    <script src="<%= "../javascripts/" + extraScripts[i]%>" ></script>
  <% }%>
  <script src="<%= "../javascripts/experiments/"+name + "/sketch.js"%>"></script>
  <style> body {padding: 0; margin: 0;} </style>
</head>

节点 ejs 动态 javascript 加载

node ejs dynamic javascript load

javascript

ejs

node.js

p5.js