Запретить загрузку каждых. js файлов при использовании webpack - PullRequest
0 голосов
/ 07 августа 2020

Я новичок в этом инструменте webpack.

Я нашел его довольно полезным, но он сильно отличался от того, что я видел в других инструментах

Я привык к одному отношения между html и js, часто называемые контроллером.

Однако похоже, что webpack просто связывает все файлы js (при условии, что у нас есть несколько файлов записей) с html без разработчиков чтобы указать, какой из них явно связывать.

Мне было интересно, почему webpack делает это, и есть ли способ добиться того, что я хочу (загрузка c js скомпилированного файла для разных html файлов ) пример очень поможет!

1 Ответ

0 голосов
/ 07 августа 2020

Вы можете написать свой собственный плагин , который это сделает:

const fs = require("fs");

class FooPlugin {
    apply(compiler) {
        // This hook fires just before droping all the bundles to dist folder.
        compiler.hooks.emit.tap('FooPlugin', (compilation) => {
            // Get the entry point chunk name. (including its hash and .js suffix).
            const getChunkFullName = (entryPoint) => {
                getChunk(compilation, entryPoint)[0].match(/(.*)\.([^(\.js)]*)\.js$/).fullName;
            }
            
            // For all entry points, create .html and inject the script tag to it.
            entryPoints.forEach((entryPoint => {
                const scriptTag = `<script src="${getChunkFullName(entryPoint)}"></script>`;

                fs.writeFile(entryPoint + ".js", `<html><body>${scriptTag}</body></html>`);
            }))

            return true;
        });
    }
}

module.exports = FooPlugin;

Затем просто используйте его в конфигурации вашего веб-пакета:

plugins: [FooPlugin]
...