我在网上找不到任何示例，该示例显示了如何（或如果可以）使用Rollup（不是Webpack）从Svelte项目输出单个HTML文件，其中包含所有内联注入的CSS和JS（而不是作为URL插入脚本）。
没有内置的方法可以做到这一点，因此您必须编写自己的插件。这段代码是完成此任务的某种方式，可以作为起点。它绝不是真正的完整或良好。 （说实话，我怀疑您会通过这种方法赢得任何形式的表现）
import svelte from 'rollup-plugin-svelte';
import fs from 'fs';
import path from 'path';
function inlineSvelte(template, dest) {
return {
name: 'Svelte Inliner',
generateBundle(opts, bundle) {
const file = path.parse(opts.file).base
const code = bundle[file].code
const output = fs.readFileSync(template, 'utf-8')
bundle[file].code = output.replace('%%script%%', code)
}
}
}
export default {
input: 'src/main.js',
output: {
format: 'iife',
file: './public/index.html',
name: 'app'
},
plugins: [
svelte({
}),
inlineSvelte('./src/template.html')
]
};
这将依赖于最基本的template.html文件
<html>
<head>
<script>%%script%%</script>
</head>
<body></body>
</html>