Как обновить исходный код модуля на чанк? - PullRequest
Новая
       37

Как обновить исходный код модуля на чанк?

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

Недавно я начал изучать, как создавать плагины для веб-пакетов.Я пытаюсь создать плагин, который будет обновлять мой исходный код.

Правила просты:

  1. Если имя точки входа меньше 2a s, я должен переименовать все переменные от haha до hehe во всех модулях упомянутой точки входа .
  2. Если точка входа имя имеет более 2 a с, я должен переименовать все переменные haha в hoho всех модулей в чанке указанной точки входа .

Это мой код:

a.js 

const haha = 'hello';
// will be "const hehe = 'hello';" in the bundle of "aa" entry point
// will be "const hoho = 'hello';" in the bundle of "aaaa" entry point
console.log(haha);
// will be "console.log(hehe);" in the bundle of "aa" entry point
// will be "console.log(hoho);" in the bundle of "aaaa" entry point
export default haha;
// will be "export default hehe;" in the bundle of "aa" entry point
// will be "export default hoho;" in the bundle of "aaaa" entry point

many.js 

import haha from 'a'; // will be "import hehe from 'a';" in the bundle
console.log(haha); // will be "console.log(hehe);" in the bundle

lots.js 

import haha from 'a'; // will be "import hoho from 'a';" in the bundle
console.log(haha); // will be "console.log(hoho);" in the bundle

webpack.config.js 

module.exports = {
 mode: 'development',
 entry: {
    aa: 'few.js',
    aaaa: 'lots.js'
 },
 output: {
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist')
 }
};

Я не знаю точно, какой правильный способсделайте это.

Вначале я подумал, что мой плагин должен зарегистрироваться на определенный хук парсера, проверить имя текущей точки входа и заменить имя ASTузел.Проблема в том, что модуль a.js анализируется только один раз.

Второй способ, который я попытался, - это зарегистрироваться на хуке render mainTemplate и переименовать переменные с помощью простого регулярного выражения.Мне не нравится этот метод, поскольку замена кода с помощью регулярных выражений чрезвычайно сложна (IMO).

Что вы думаете?Какой правильный путь к этому?

Ответы [ 2 ]

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

Я правильно.Вы не можете получить информацию о входе в модули.Я думаю, что вы можете решить, может быть, не используя точку входа.Поскольку модули кэшируются после загрузки, мы можем использовать встроенный запрос ресурса

a.js 

    const haha = 'hello';
    console.log(haha);
    export default haha;

less.js 

    import haha from './a?change=e'; // will be "import hehe from 'a';" in the bundle
    console.log(haha); // will be "console.log(hehe);" in the bundle

lots.js 

    import haha from './a?change=o'; // will be "import hehe from 'a';" in the bundle
    console.log(haha); // will be "console.log(hoho);" in the bundle

пользовательский загрузчик -> transformer.js 

    module.exports = function(source) {
      let queryval = "";
      if (this.resourceQuery && this.resourceQuery.indexOf('change')) {
        queryval = this.resourceQuery.substr(this.resourceQuery.indexOf("change"+ 1));
        // console.log("queryval: ", queryval);
        if (queryval) {
          const replacedCode = source.replace(/[a]/g, queryval); // this replace every thing but need own logic even default -> def_ult _ is query val :P
          console.log("replacedCode: ", replacedCode);
          return replacedCode;
        }
      }
      return source;
    }

webpack.config.js 

    const path = require('path');

    module.exports = {
        mode: 'development',
        entry: {
            aa: './src/few.js',
            aaaa: './src/lots.js'
        },
        module: {
          rules: [
            {
              test: /\.js$/,
                oneOf: [
                  {
                    resourceQuery: /change/,
                    use: [
                      {
                        loader: path.resolve('./src/transformer.js'),
                        options: {
                          replaceWith: true
                        }
                      }
                    ],
                  },
                  {
                    loader: path.resolve('./src/transformer.js'),
                  }
                ],
            }
          ]
        },
        output: {
            filename: '[name].js',
            path: path.resolve(__dirname, 'dist')
        },
        optimization: {
          runtimeChunk: "single"
        }
    };
0 голосов
/ 26 сентября 2018

Я открыл выпуск .Ответ от Тобиаса Коппера :

Это невозможно.

Модули не зависят от исходной точки входа.Граф модуля не содержит эту информацию.В дополнение к этому модули могут находиться в обеих точках входа, но в этом случае они не собираются дважды.

...