/**
* Provides the ability to reference external css/js files for the generated html
* Method source once issues: https://github.com/rollup/plugins/issues/755
* @param {Array} externals List of external files.
* The format is: [{ type: 'js', file: '//xxxx1.js', pos: 'before' }, { type: 'css', file: '//xxxx1.css' }]
*
* @return {Function} The templae method required by plugin-html
*/
export default function htmlTemplate(externals) {
return ({ attributes, files, meta, publicPath, title }) => {
let scripts = [...(files.js || [])];
let links = [...(files.css || [])];
// externals = [{ type: 'js', file: '//xxxx1.js', pos: 'before' }, { type: 'css', file: '//xxxx1.css' }]
if (Array.isArray(externals)) {
const beforeLinks = [];
const beforeScripts = [];
externals.forEach((node) => {
let fileList;
const isCssFile = node.type === 'css';
if (node.pos === 'before') {
fileList = isCssFile ? beforeLinks : beforeScripts;
} else {
fileList = isCssFile ? links : scripts;
}
fileList.push({ fileName: node.file });
});
scripts = beforeScripts.concat(scripts);
links = beforeLinks.concat(links);
}
scripts = scripts
.map(({ fileName }) => {
const attrs = makeHtmlAttributes(attributes.script);
return ``;
})
.join('\n');
links = links
.map(({ fileName }) => {
const attrs = makeHtmlAttributes(attributes.link);
return ``;
})
.join('\n');
const metas = meta
.map((input) => {
const attrs = makeHtmlAttributes(input);
return ``;
})
.join('\n');
return `
${metas}
${title}
${links}
${scripts}