Including additional content file not working - <?!= ?> tags rendering as text

Question

I am following the code in the best practices page's section for "Separate HTML, CSS, and JavaScript" to the dot. (https://developers.google.com/apps-script/guides/html/best-practices#separate_html_css_and_javascript)

However, instead of rendering the CSS/Javascript within my included pages, the tag is rendered as text on the page:

<?!= include('Stylesheet'); ?>

Additionally, I also tried replacing the include function with a direct call to HtmlService instead, but yielded the same results:

<?!= HtmlService.createHtmlOutputFromFile('Stylesheet').getContent(); ?>

Am I missing something important here?

Thanks

Answer 1

Make sure you are using HtmlService.createTemplateFromFile() method, and not .createHtmlOutputFromFile() in your Code.gs file - that's a common mistake when working with templated HTML in GAS. From the code snippets you posted it looks like that might be your problem. Full docs here: link