управляющий файл, чтобы не генерировать новый блок зависимостей сверху - PullRequest
Новая
       6

управляющий файл, чтобы не генерировать новый блок зависимостей сверху

0 голосов
/ 22 сентября 2018

Я новичок в написании плагинов для Webpack.

Я хочу добавить новую функцию в существующее хранилище плагинов для Webpack.

Функция заключается в том, чтобы разрешить структуру подпакета в.json файл, то зависимости ниже корней подпакета должны быть отделены от основного поставщика пакета пакета.

например, мой app.json: 

{
  "pages":[
    "pages/one/one",
    "pages/two/two"
  ],
  "subPackages": [
    {
      "root": "pages/sub",
      "pages": [
        "one",
        "two"
      ]
    }
  ]
}

, так что если мой проектsrc структура выглядит следующим образом: 

--pages
   --one
     --one.js
     --one.html
     --one.css
     --one.service.js
   --two
     --two.js
     --two.html
     --two.css
     --two.service.js
   --sub
     --folder
       --test.js
     --one.js
     --one.html
     --one.css
     --one.service.js

тогда я ожидаю, что ее dist будет иметь вид: 

[[ CASE A ]]
--pages
   --one
     --one.js
     --one.html
     --one.css
   --two
     --two.js
     --two.html
     --two.css
   --sub
     --folder
       --test.js
     --one.js
     --one.html
     --one.css
     --one.service.js
--vendor.js

или: 

--pages
   --one
     --one.js
     --one.html
     --one.css
   --two
     --two.js
     --two.html
     --two.css
   --sub
     --one.js
     --one.html
     --one.css
     --vendor.js
--vendor.js

ТекущийСпособность репо состоит в том, чтобы объединить все зависимости и вывести их в файл поставщика корневого пути.

Итак, мой код: 

// waiting For Compiling And Deal By SingleEntryPlugin
async getEntryResources() {
    const appJSONFile = resolve(base, 'app.json');
    const { pages = [], subPackages = [] } = await readJson(
        appJSONFile
    );

    const subDepFiles = [];
    for (const subPackage of subPackages) {
        const { root, pages = [] } = subPackage;
        const scripts = pages.map(w => resolve(base, join(root, w)));

        const subFiles = await globby(join(root, '**/*'), {
            cwd: base,
            nodir: true,
            realpath: true
        });

        subFiles.forEach(resource => {
            const name = stripExt(resource)
            if (/\.js$/.test(resource) && scripts.indexOf(name) < 0) {
                subDepFiles.push(name.slice(name.indexOf(root)));
            }
        })

    }

    this.subRoots = subPackages.map(v => v.root);

    // pages + subpages + subpages' dependencies
    return [
        ...pages,
        ...subDepFiles,
        ...[].concat(...subPackages.map(v => v.pages.map(w => join(v.root, w))))
    ];
}

, тогда мой applyCommonsChunk фильтрует зависимости от корней подпакета: 

applyCommonsChunk(compiler) {
    const scripts = entryResources.map(::this.getFullScriptPath);

    compiler.apply(
        new CommonsChunkPlugin({
            name: 'vendor',
            minChunks: ({ resource }) => {
                if (resource) {
                    const inSubPackage = this.subRoots.find(v => resource.match(v))
                    return /\.js$/.test(resource) && scripts.indexOf(resource) < 0 && !inSubPackage;
                }
                return false;
            }
        })
    );
}

, тогда мой vendor.js равенхорошо, и может выводить как [[CASE A]], но sub/one.js имеет копию службы вместо импорта из sub/one.service.js.

...