Выходной файл HTML из проекта Svelte - PullRequest
Новая
       139

Выходной файл HTML из проекта Svelte

0 голосов
/ 02 мая 2020

Я не могу найти нигде в Интернете примера, показывающего, как (или если мы можем) вывести один файл HTML из проекта Svelte с использованием Rollup (не Webpack), содержащий все CSS и JS введенные встроенный (а не как URL в скрипте).

1 Ответ

1 голос
/ 03 мая 2020

Нет встроенного способа для достижения этой цели, поэтому вам придется написать свой собственный плагин для этого. Этот код является своего рода попыткой сделать это и может стать отправной точкой. Это никоим образом не является полным или хорошим. (если честно, я сомневаюсь, что с таким подходом вы выиграете какую-либо производительность) 

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')
    ]
};

Это будет зависеть от шаблона . html файла, который в своей основе c хотел бы это 

<html>
    <head>
        <script>%%script%%</script>
    </head>
    <body></body>
</html>
...