我找不到将外部 .js 文件包含到 Node ejs 模板中的方法。我想将逻辑和数据放入外部 .js 文件中的对象中，将该文件包含到 index.ejs 模板并从中提取数据。
我尝试通过插入标准方式
<script src="sample.js"></script>然后我尝试了 ejs 特定关键字
<% include partials/sample.js %>我将 .js 文件插入到可执行文件 server.js 中定义的静态目录中，再次没有结果。
但有趣的是，例如，将 css 文件包含到 ejs 模板中经典方式效果很好
<link href="/assets/styles.css" rel="stylesheet" type="text/css" />
解决方法是包含外部 ejs 文件，我将逻辑和数据放入 <% %> 标签内，但这显然是一个补丁，而不是一个可行的解决方案，因为 ejs 不是 js 文件。此外，它不起作用。
我在互联网上找不到任何解决方案。有什么提示吗？
谢谢
你不能。
注意：您只能将数据从 .ejs 文件传递到 .js 文件，而不能以其他方式传递数据。它不起作用，因为 .ejs 在服务器端呈现，而 .js 在客户端运行。 我假设您在服务器端使用 EJS
1）您可以将 ejs 变量值传递给 Javascript 变量
<% var test = 101; %> // variable created by ejs
<script>
var getTest = <%= test %>; //var test is now assigned to getTest which will only work on browsers
console.log(getTest); // successfully prints 101 on browser
</script>
2）你不能将 js 变量值传递给 ejs 变量
是的，您不能：如果它在服务器上。
为什么：
EJS 模板将在 js 开始执行之前在服务器上渲染（它将在浏览器上启动），因此无法返回服务器并要求对已发送到浏览器的页面进行一些先前的更改。
Express 的解决方法：
myScripts.js
module.export = {
foo() {},
bar() {}
}
然后在你的app.js中
var myScripts = require('/path/to/myScripts');
res.render('template', {
utils: myScripts
}); // you forgot a ')' here
然后在你的 template.ejs 中
// utils will act in global scope for this file
<%
utils.foo();
utils.bar();
%>
我相信你的使用违背了它的意图。 在控制器中，您可以定义要包含的外部脚本和样式，如下所示
res.render('page-one', {
title: 'Page One',
data: pageData,
libs: ['page-one', 'utils'],
styles: ['page-one']
});
在应用程序的静态资产中，您有一个 js 文件夹和一个 css 文件夹
|- static/
|- css/
|- fonts/
|- img/
|- js/
favicon.ico
|- templates/
在 js 文件夹中放置文件 page-one.js 和 utils.js 在你的 css 文件夹中放置文件 page-one.css
在 ejs 模板中 html 的 head 部分
<!-- styles included on all pages -->
<link rel="stylesheet" href="/css/bootstrap.css">
<!-- styles specific to individual pages -->
<% if (typeof styles !== 'undefined') { %>
<% if (styles.length > 0) { %>
<% for (let style of styles) { %>
<link rel="stylesheet" href="/css/<%= style %>.css">
<% } %>
<% } %>
<% } %>
通常，最佳实践是在结束 body 标记处包含脚本，这样它们就不会阻止页面渲染，因此位于 ejs 文件中的结束 body 标记之前
<!-- scripts included on all pages -->
<script src='/js/libs/jquery.min.js' type='text/javascript'></script>
<!-- page specific scripts -->
<% if (typeof libs !== 'undefined') { %>
<% for (let lib of libs) { %>
<script src='/js/<%= lib %>.js' type='text/javascript'></script>
<% } %>
<% } %>
</body>
当您的页面呈现时，它将自动呈现脚本和 CSS 包含 if 块是为了防止您在控制器中没有定义任何包含内容。 在 Express 应用程序中，您定义静态和外部脚本，如下所示 请记住上面我们在名为 static 的目录中创建了 js 和 css 文件夹
// Define static assets
app.use(express.static('static'));
// included on all pages
app.use('/js/libs', express.static(path.join(process.cwd(), 'node_modules/jquery/dist'), { maxAge: 31557600000 }));
最后，如果您绝对必须在模板中包含 JavaScript，例如使用特殊的 ejs 标签渲染 JSON 数据等 <%- %>
<% if (jsonData) { %>
<script id="jsonData">var jsonData=<%- JSON.stringify(jsonData) %>;</script>
<% } %>
我可以通过以下方式做到这一点：
app.use(express.static(path.join(__dirname, 'views/js')));
在views/js文件夹中的index.js文件中添加了DOM函数。
在index.ejs 文件的结束正文标记之前添加了链接到index.js 文件的脚本标记，如下所示：
<script scr="index.js" type="text/javascript"></script>
注意script标签中的src没有
"./js/index.js"您可以通过添加以下代码来实现：
app.use(express.static(path.join(__dirname,public)));您必须在项目文件夹中添加一个名为 public （或您命名的任何名称）的目录。在该文件夹中，您可以添加外部 JS 文件。
注意：当您从项目文件夹外部调用/启动应用程序时，表达式
path.join✅ 您实际上可以实现这一目标（更具体地说对于 DOM）： 1） 设置静态资产（服务器端）
app.use(express.static('public'))
2）在公共文件夹中创建一个名为 js 的文件夹
3）将您需要包含在 ejs 文件中的任何 js 文件放入此文件夹（public/js/external.js）
4）最后放入ejs文件的末尾/开头（您可以在标签中使用defer，具体取决于预加载或后加载的需要）
<script src='/js/external.js' type='text/javascript'></script>
（如果您尝试在 vscode 中自动访问此路径，您将找不到任何内容，因为它已经被服务器端的应用程序更改，因此它知道所有静态资源都会自动从那里提取）
如果有帮助请点赞！！！！！！！！！！！！！！！