使用 EJS 添加部分模板时的空格

Question

我正在使用 SailsJS 和 EJS 引擎。

当我在布局文件中使用 <% include partials/template.ejs %> 或 <% partial('partials/template.ejs') 添加部分内容时，在已编译的 HTML 代码 (template.ejs) 之前会出现空格。

请注意，当我在布局中复制粘贴 template.ejs 内容（不使用 include/partials）时，空格消失了。

见下图：

第一部分：代码。

第二部分： chrome DOM。

第三部分：空白元素检查（DOM属性）

Answer 1

我也遇到过同样的问题。 我做的很简单。

转到ejs模块index.js文件。 求偏函数。 找到这部分代码：

var source = options.cache
? cache[key] || (cache[key] = fs.readFileSync(file, 'utf8'))
: fs.readFileSync(file, 'utf8'); 

并将其替换为

var source = options.cache
? cache[key] || (cache[key] = fs.readFileSync(file, 'utf8').trim())
: fs.readFileSync(file, 'utf8').trim();

所以，我所做的只是使用了trim() java脚本函数。

希望对您有帮助。

Answer 2

我在使用 ejs render 时遇到了同样的问题。我的代码中包含一些空格，导致位置问题。

我在互联网上到处寻找，最后构建了自己的解决方案：

    var clean= function(selecteur) {
        var save=new Array();
        selecteur.children().each(function() {
            save.push(this);
        });
        selecteur.empty();
        for(i in save) {
            selecteur.append(save[i]);
        }
    };

可以在任何需要清除空格的 jquery 选择器容器上调用此函数。它的工作原理基本上是将所有内容保存在本地变量中，清空容器，然后添加保存的内容。

Answer 3

我遇到了同样的事情，至少在我的情况下，这是由于 EJS 部分函数使用

fs.readFileSync(file, 'utf8')

根据

https://github.com/nodejs/node-v0.x-archive/issues/1918

不删除 UTF-8 BOM。如果 EJS 引擎为我们去掉 BOM 就好了，但将部分文件保存为没有 BOM 的 UTF-8 格式解决了我的问题。

Answer 4

使用

<%_

标签而不是

<%

标签。

阅读更多相关信息这里

<%_ would strip off any trailing whitespaces that <% leaves upon rendering