vue和nunjucks的变量插值的形式{{}}冲突

Nunjucks 中修改配置

const nunjucks = require('nunjucks');const template_old = nunjucks.renderString('template_old: Hello, {{name}}!', { name: 'World' });
console.log(template_old); // 配置 Nunjucks 环境
nunjucks.configure({tags: {variableStart: '$(', // 设置变量起始标记为 $(variableEnd: ')'     // 设置变量结束标记为 )}
});// 在模板中使用新的变量插值形式
const template_new = nunjucks.renderString('template_new: Hello, $(name)!', { name: 'World' });
console.log(template_new); 

注意，这里只是作为演示，实际应用中最好不要用$(作为起始，因为会跟前端的js代码冲突。如果前端有$(function () {});就会报错，无法显示页面。

个人建议将花括号{{ }}改成[[ ]]中括号，起码键位是一致的，减少变更标签带来的麻烦。

Nunjucks参考这里对variable进行修改
https://mozilla.github.io/nunjucks/api.html#customizing-syntax

Vue中修改配置

修改vue的标识符，前后加{% raw %}、{% endraw %}，如下：

{% raw %}{{result.name}}{% endraw %}

或者修改下Vue的delimiters属性

new Vue({delimiters: ['${', '}'] // 分隔符变成了 ES6 模板字符串的风格
})

Vue参考这里对全局配置进行修改：
https://cn.vuejs.org/v2/api/#delimiters